Повторное рисование указаний API Карт Google при перемещении маркера?

Question

Я пытаюсь сделать 2 вещи:

• перерисовать маршрут, когда маркер перемещается.
• Заполните значение GPS нового customer, когда маркер перемещается.

Наконец-то я получил подвижный маркер, но он не обновляет значение или не перерисовывает маршрут. Что мне не хватает?

HTML-:

<div id="map_canvas" style="width:500px;height:380px;"></div> 
<br> 
<input type="text" class="form-control" id="customer_location" value="" readonly="true"> 

JS:

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

       function initialize_create_task_map() { 
        directionsDisplay = new google.maps.DirectionsRenderer({ 
          suppressMarkers: true 
         }); 
        var newyork = new google.maps.LatLng(40.621757, -73.984927); 
        var myOptions = { 
         zoom:14, 
         mapTypeId: google.maps.MapTypeId.ROADMAP, 
         center: newyork 
        } 

        map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); 
        directionsDisplay.setMap(map); 


        printRoute(); 

       } 

       function printRoute() { 

      var distanceInput = document.getElementById("distance"); 
        var restaurant = "40.679666, -73.964425"; 
        var customer = "40.615758, -74.007652"; 

        var locations = [ 
           ['Restaurant', 40.679666, -73.964425,'https://developers.google.com/maps/documentation/javascript/examples/full/images/beachflag.png'], 
           ['Customer', 40.615758, -74.007652,'https://developers.google.com/maps/documentation/javascript/examples/full/images/beachflag.png'] 
          ]; 

        var request = { 
         origin:restaurant, 
         destination:customer, 
         waypoints: [], 
         travelMode: google.maps.DirectionsTravelMode.WALKING 
        }; 
        console.log("Preparing marker..."); 
        //add marker to each locations 
          for (i = 0; i < locations.length; i++) { 
          console.log("Adding marker..."); 
           marker = new google.maps.Marker({ 
               position: new google.maps.LatLng(locations[i][1], locations[i][2]), 
               map: map, 
               draggable:true, 
               icon: locations[i][3] 
           }); 

           google.maps.event.addListener(marker, 'dragend', function() 
           { 
          distanceInput.value = marker.getPosition(); 
           }); 

          } 

        directionsService.route(request, function(response, status) { 
         if (status == google.maps.DirectionsStatus.OK) { 
          directionsDisplay.setDirections(response); 
         } 
        }); 
       } 

google.maps.event.addDomListener(window, 'load', initialize_create_task_map); 

Живая скрипка: https://jsfiddle.net/w1nae25n/2/

Answer 1

Используйте это событие на перетаскивая маркер и получить новую позицию и перейти к этому лат долго новый запрос по направлениям:

google.maps.event.addListener(marker, 'dragend', function (event) 
          { 
         // distanceInput.value = marker.getPosition(); 
         console.log(this.getPosition().lat()); 
         console.log(this.getPosition().lng()); 

          });