MicheleBertoli/react-gmaps

How to add OverlayView with react-gmaps?

feux07 opened this issue · 2 comments

Hi, everyone!

Can we use OverlayView with react-gmaps like this example ?

Hello @feux07,
at the moment there's no Overlay component in react-gmaps (PRs are welcome :)).

Luckily, there's the onMapCreated callback which provides you the actual map instance.
At that point, you can do all the things you do with the regular Google Maps SDK (e.g. adding overlays).

For instance, following this official example, instead of creating the map like:

       var map = new google.maps.Map(document.getElementById('map'), {
          zoom: 11,
          center: {lat: 62.323907, lng: -150.109291},
          mapTypeId: 'satellite'
        });

You receive it from the mapCreated event, and you can add any overlay to it:

<Gmaps onMapCreated={this.handleMapCreated} ... />
handleMapCreate(map) {
  // ... 
  overlay = new USGSOverlay(bounds, srcImage, map);
}

Hope this helps!

Hi @MicheleBertoli,

I forgot to thanks, for your quick reply and your awesome component.

Have a nice working day