Question

Thanks for any help you can provide! I’m new to Google Maps, and I’m using the RouteOptimize code from API V3. I’m trying to make the resulting route “draggable.” Below is part of my code, but I know I’m missing something simple with the directionsDisplay.

var rendererOptions = {
draggable: true
};
var directionsDisplay = new google.maps.DirectionsRenderer(rendererOptions);;
        var directionsService = new google.maps.DirectionsService();
        var map;

        function initialize() {
          directionsDisplay = new google.maps.DirectionsRenderer({panel:document.getElementById('directions_panel')});
          var chicago = new google.maps.LatLng(41.850033, -87.6500523);
          var mapOptions = {
            zoom: 6,
            mapTypeId: google.maps.MapTypeId.ROADMAP,
            center: chicago
          }
          map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions);
          directionsDisplay.setMap(map);
        }

Answer 1

You are missing the draggable option to the DirectionsRenderer

    var directionsService = new google.maps.DirectionsService();
    var map;
    var directionsDisplay;

    function initialize() {
      var rendererOptions = {
        draggable: true,
        panel:document.getElementById('directions_panel')
      };

      directionsDisplay = new google.maps.DirectionsRenderer(rendererOptions);
      var chicago = new google.maps.LatLng(41.850033, -87.6500523);
      var mapOptions = {
        zoom: 6,
        mapTypeId: google.maps.MapTypeId.ROADMAP,
        center: chicago
      }
      map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions);
      directionsDisplay.setMap(map);
    }