@preflower/react-native-web-maps v0.2.0

react-native-web-maps

react-native-maps for Web.

Overview

react-native-web-maps allow you to using react-native-maps seamlessly on the web, it base on @react-google-maps/api.

Usage

npm i @preflower/react-native-web-maps

webpack.config.js

  module.exports = {
    ...
    resolve: [
      alias: [
        ...
        'react-native': 'react-native-web',
+       /* set alias from react-native-maps to @preflower/react-native-web-maps */
+       'react-native-maps': '@preflower/react-native-web-maps'
      ]
    ]
  }

App.web.tsx/jsx

<!-- Before use Google Maps, you need to initialize it first -->
import { LoadScript } from '@preflower/react-native-web-maps'

const App = () => {
  return (
    <LoadScript googleMapsApiKey="...">
      ...content
    </LoadScript>
  )
}

Support Components

react-native-web-maps only override 👇 components, and export all other @react-google-maps/api apis

MapView

Marker

Polygon

Polyline

Notice

• In addition to style, other style property (such as mapContainerStyle) not support React-Native StyleSheet, because react-native-web convert it into class, it will result exception

Develop Plan

At present, library is only used by myself, so i only developed the features that i needed, if someone needs feature that currently not supported, please commit issue or PR to let me know.

License

MIT