2

I'm new to react-google-maps and I want to add an eventlistener to the map such that when I click any point on the map, I can get the coordinate of that point, however, I really don't know where I should add the event Listener. Snippets of my code is as following:

return(
            <GoogleMap
            defaultZoom={10}
            defaultCenter={{ lat: 22.3193, lng: 114.1694 }}
            onClick = {this.homepage} >
            </GoogleMap>
);

I wonder why it seems that the onClick doesn't work when I click on the map? Thank you guys a lot!

Leslie Pu
  • 21
  • 1
  • 2

2 Answers2

4

Check out sandbox link

   <GoogleMap
    onClick={ev => {
      console.log("latitide = ", ev.latLng.lat());
      console.log("longitude = ", ev.latLng.lng());
    }}
    defaultZoom={3}
    defaultCenter={{ lat: -34.397, lng: 150.644 }}
  >
joy son
  • 555
  • 6
  • 15
1

I used the "joy son" code but with a small correction:

<GoogleMap
onClick={ev => {
  console.log("latitide = ", ev.lat);
  console.log("longitude = ", ev.lng);
}}
defaultZoom={3}
defaultCenter={{ lat: -34.397, lng: 150.644 }}