Question

I just started working using Google Maps API yesterday, and trying to set up drive directions to my map. My problem is: when I call the function load,

// [...]  
gdir = new GDirections(map, directionsPanel);  
// [...]  
gdir.load("from: " + fromAddress + " to: " + toAddress);  

it returns a map whose markers are not draggable. So, I need to make them draggable in order to recalculate the directions, but I can’t get the markers objects.

Someone knows how can I do it?

Answer 1

You need to add a handler on the GDirections object for the addoverlay event:

GEvent.addListener(gdir, "addoverlay", onGDirectionsAddOverlay);

When your onGDirectionsAddOverlay handler is called you can iterate through the new markers and replace them with draggable copies:

for (var i = 0; i <= gdir.getNumRoutes(); i++) 
{
    var originalMarker = gdir.getMarker(i);
    latLngs[i] = originalMarker.getLatLng();
    icons[i] = originalMarker.getIcon();
    newMarkers[i] = new GMarker(latLngs[i], { icon: icons[i], draggable: true, title: 'Kan flyttes' });
    map.addOverlay(newMarkers[i]);

    // add stuff to your newMarkers[i] drag end event...
    // ...

    //Bind 'click' event to original markers 'click' event
    copyClick(newMarkers[i], originalMarker);

    // Now we can remove the original marker safely
    map.removeOverlay(originalMarker);
}

You can find a working example of this here (source).