移動標記時重新繪製Google Maps API路線？

移動標記時重繪路線。
當標記移動時，填寫新的customer位置的GPS值。

我終於得到了移動標記的工作，但它沒有更新值或重新繪製路線。我錯過了什麼？

的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/

來源

2017-02-20 Mark M.

使用上拖動標記，並獲得新的位置，並傳遞給該此事件Lat Long網新請求方向：

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

          });

來源

2017-02-20 07:10:16

移動標記時重新繪製Google Maps API路線？

回答

相關問題