Question

I have an application that shows tracking data. With the map, and the track, I have a chart that show the speed of each point of the polilyne. When I move over the chart, the same point in the maps is highlighted.

What I need to do is: when I move the pointer over the polyline on the map, also highlight the point on the chart, for this, I need to get the nearest point from the polyline to the mouse pointer on the map.

I binded the polyline mousemove event, but I can't find any property that helps me.

Was it helpful?

Solution

the point(latLng) is a property of the mouseEvent

google.maps.event.addListener(polylineInstance, 'mousemove',function(e){
  console.log(e.latLng)
})

To get the clicked segment of the Polyline, iterate over the path of the Polyline, create a temporarily polyline for each segment and use google.maps.geometry.poly.isLocationOnEdge() to check if the click has been on the current segment.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top