从Google地图中的备用路线中提取距离

时间:2014-01-15 02:01:11

标签: javascript google-maps

这是我的代码:

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

      function initialize() {
        document.getElementById('hide').style.display = 'none';
        document.getElementById('hide2').style.display = 'none';
        directionsDisplay = new google.maps.DirectionsRenderer();
        var mapOptions = {
          zoom: 15,
          mapTypeId: google.maps.MapTypeId.ROADMAP,
          center: new google.maps.LatLng(14.588723, 120.975768),
        };
        map = new google.maps.Map(document.getElementById('map_canvas'),
            mapOptions);

        //Find From location    
    var fromText = document.getElementById('start');
    var fromAuto = new google.maps.places.Autocomplete(fromText);
    fromAuto.bindTo('bounds', map);
    //Find To location
    var toText = document.getElementById('end');
    var toAuto = new google.maps.places.Autocomplete(toText);
    toAuto.bindTo('bounds', map);
    //  


        directionsDisplay.setMap(map);
        directionsDisplay.setPanel(document.getElementById('directions-panel'));

        var control = document.getElementById('control');
        control.style.display = 'block';
        map.controls[google.maps.ControlPosition.TOP].push(control);
      }

      function calcRoute() {
        var start = document.getElementById('start').value;
        var end = document.getElementById('end').value;
        var request = {
          origin: start,
          destination: end,

  provideRouteAlternatives: main_route,
          travelMode: google.maps.DirectionsTravelMode.DRIVING
        };
        directionsService.route(request, function(response, status) {
          if (status == google.maps.DirectionsStatus.OK) {
            directionsDisplay.setDirections(response);
            computeTotalDistance(response);
          }
        });
      }
            function calcRoute1() {
            if (window.event.keyCode == 13){
        var start = document.getElementById('start').value;
        var end = document.getElementById('end').value;
        var request = {
          origin: start,
          destination: end,
          provideRouteAlternatives: true,
          travelMode: google.maps.DirectionsTravelMode.DRIVING

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

          }
        });
      }}
      function computeTotalDistance(result) {

      var total = 0;
      var myroute = result.routes[0];
      for (i = 0; i < myroute.legs.length; i++) {
        total += myroute.legs[i].distance.value;

      }

我设置了这个:

provideRouteAlternatives: true

我在 directionsPanel

中获得了替代路线

我可以通过这种方式得到主要的路线距离:

var myroute = result.routes[0];
      for (i = 0; i < myroute.legs.length; i++) {
        total += myroute.legs[i].distance.value;

      }

所以,我可以计算出租车票价,例如。

但是当我点击 directionsPanel 上显示的替代路线时,我无法弄清楚如何获得新的距离。所以它可以计算新的票价。

请帮忙!

1 个答案:

答案 0 :(得分:0)

在DirectionsRenderer上收听directions_changed事件。事件发生时,使用getRouteIndex发现当前选定的路线。然后使用上面的代码和新的路由索引。

https://developers.google.com/maps/documentation/javascript/reference#DirectionsRenderer