Map location of mouse click

1

Hi

I’m looking for a way of identifying the coordinates on a map where a user clicks/taps. If anyone can anyone point me in the right direction it’d be much appreciated? I’ve been playing around with google.maps.MouseEvent but obviously I’ve got it wrong.

I’m using this…

  lat = FarmMap.mapOptions.latitude
  lon = FarmMap.mapOptions.longitude

but it doesn’t change coordinates when the map is clicked or scrolled.

2

Are you using the google maps plugin or doing this in a browser?

3

Browser for testing. Ultimately on device as a pwa

4

Answered my own question, which is good I guess. Here’s the solution for anyone interested. Imagine it’s not the sexiest but works.

   Function initMap()
  Const origin = { lat: -37.668582, lng: 175.316910 }
  Const map = new google.maps.Map(document.getElementById("FarmMap"), {zoom: 18, center: origin, mapTypeId: "satellite"})
  new ClickEventHandler(map, origin)
End Function

Function ClickEventHandler(map, origin)
    this.origin = origin
    this.map = map
'    this.directionsService = new google.maps.DirectionsService();
'    this.directionsRenderer = new google.maps.DirectionsRenderer();
'    this.directionsRenderer.setMap(map);
'    this.placesService = new google.maps.places.PlacesService(map);
    this.infowindow = new google.maps.InfoWindow()
    this.infowindowContent = document.getElementById("infowindow-content")
    this.infowindow.setContent(this.infowindowContent)
    console.log("Listen For clicks On the map.")
    this.map.addListener("click", handleMapClick.bind(this))
End Function

Function handleMapClick(event) 
    console.log("You clicked on: " + event.latLng)
End Function