Detect waypoint click on DirectionsRenderer marker in Google Maps v3

In the Google Maps API v3, how can I get the waypoint markers from the DirectionsRenderer in order to add click events to them (such as a delete开发者_如何学Python menu).

Until a better solution can be found here is the work around that I have employed. The basic idea is to put your own marker on top of the waypoints and bind a click event listener to your marker. I have made a jsfiddle demonstrating the idea.

It definitely isn't perfect, but with a custom icon instead of the default marker it could look sort of natural.

Another way, which doesn't involve putting new markers on the map, would be to detect DOM click events on the map widget. The idea is simple. When a click is detected:

1. convert all waypoints' LatLng coordinates to coordinates on the screen (or, in fact, on the map widget) using MapCanvasProjection
2. calculate distances between waypoints and the point clicked. If user clicked close enough to any of the waypoints (the distance is lower than the radius of a waypoint icon) - display a menu for that point

I coded a complete solution in java for gwt. It should be pretty straightforward to get it translated into javascript.

Instead of creating a click event on a waypoint, you can create it on a marker, and assign it a high z-index so it overlays the waypoint.

1. Create the single markers and assign the a high z-index

    marker = new google.maps.Marker({
      map:map,
      position: new google.maps.LatLng(1.99, 2.99),
    });
    marker.setZIndex(999);

2. Add a listener to the markers

google.maps.event.addListener(marker, 'click', function(event){
      alert(marker.title);
    }); 

3. And now create the waypoints.