google-maps-api-3 - 谷歌地图：如何通过拖放由 DirectionRender 服务显示的路线来检测更改事件？

Question

我正在使用谷歌地图进行分类案例。这是代码：

// create map
            var map = new google.maps.Map(document.getElementById("map_canvas"), $scope.map_options);
            var dirService= new google.maps.DirectionsService();
            var dirRenderer= new google.maps.DirectionsRenderer();
            var dirContainer=document.getElementById('dir-container');

             dirRenderer.setOptions({
                 draggable:true,
             });

             var showDirections = function(dirResult, dirStatus) {
            if (dirStatus != google.maps.DirectionsStatus.OK) {
                alert('Veuillez saisir des adresses valides');
                return;
              }
              // Show directions
            dirRenderer.setMap(map);
            dirRenderer.setDirections(dirResult);
            dirRenderer.setPanel(dirContainer);

        };
       dirService.route($scope.master, showDirections);

我想触发用户修改路线的事件。使用此选项可以通过拖放来修改路线：

dirRenderer.setOptions({
                     draggable:true,
                 });

我怎样才能赶上这个事件。我的代码中已经有这个事件：

   google.maps.event.addListener(dirRenderer, 'routeindex_changed', 
                    function() {  });   
  google.maps.event.addListener(dirRenderer, 'directions_changed', 
                    function() {  });

Answer 1

它在 google API 方向示例中提供。以下是拖动后触发事件的代码。

       directionsDisplay.addListener('directions_changed', function() {
        computeTotalDistance(directionsDisplay.getDirections());
        console.log(directionsDisplay);
      });

此外，如果您对 computeTotalDistance 函数感兴趣

function computeTotalDistance(result) {
var total = 0;
var myroute = result.routes[0];
for (var i = 0; i < myroute.legs.length; i++) {
total += myroute.legs[i].distance.value;
}
total = total / 1000;
document.getElementById('total').innerHTML = total + ' km';
}