react-google-maps

React google maps components

Installation

npm install --save @wapps/react-google-maps

How to use

import React from 'react';
import GoogleMaps, { Map } from '@wapps/react-google-maps';

const App = () => (
  <GoogleMaps api={{ key: YOUR_googleMaps_KEY }}>
    <div style={{ height: '100vh', width: '100wh' }}>
      <Map
        center={{
          lat: 52.520008,
          lng: 13.404954,
        }}
        zoom={15}
      />
    </div>
  </GoogleMaps>
);

export default App;

Marker

...
  <Map
    center={{
      lat: 52.520008,
      lng: 13.404954,
    }}
    zoom={15}
  >
    <Marker
      position={{
        lat: 52.520008,
        lng: 13.404954,
      }}
      onClick={() => console.log('Click')}
    />
  </Map>
...

TrafficLayer

...
  <Map
    center={{
      lat: 52.520008,
      lng: 13.404954,
    }}
    zoom={15}
  >
    <TrafficLayer autoRefresh />
  </Map>
...

Live Demo

For a demo, check out https://hupe1980.github.io/wapps-components/

License

MIT