MicheleBertoli / react-gmaps

A Google Maps component for React.js

Home Page:http://react-gmaps.herokuapp.com/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

using gmaps polyline

geraldsamosir opened this issue · comments

can i use google maps polyline in this package ? if yes, can you give some example ? for use it or maybe modification this package

Hello @geraldsamosir, any feature of the Google Maps SDK works with this package.
The onMapCreated callback gives you the actual map instance, which you can use to do whatever you need, for example:

handleMapCreated(map) {
  const flightPlanCoordinates = [
    {lat: 37.772, lng: -122.214},
    {lat: 21.291, lng: -157.821},
    {lat: -18.142, lng: 178.431},
    {lat: -27.467, lng: 153.027},
  ]
  const flightPath = new google.maps.Polyline({
    path: flightPlanCoordinates,
    geodesic: true,
    strokeColor: '#FF0000',
    strokeOpacity: 1.0,
    strokeWeight: 2,
  })

  flightPath.setMap(map)
},

render() {
  return (
    <Gmaps
      width={'50%'}
      height={'500px'}
      lat={21.291}
      lng={-157.821}
      zoom={2}
      onMapCreated={this.handleMapCreated} />
  )
}

screen shot 2017-06-07 at 06 50 14