谷歌在DirectionsService中映射api departureTime

时间:2016-01-20 09:28:46

标签: api google-maps google-maps-api-3

我试图设置departureTime选项,但似乎不起作用。 在这个例子中,本赛季Bormio和Prato allo Stelvio之间的道路ss38已关闭。 从8月开始,我希望您使用的是这条路而不是目前通过瑞士提供的路。

感谢

这是我的代码:

function initialize() {

  map = new google.maps.Map(document.getElementById("map"), {
    mapTypeId: google.maps.MapTypeId.ROADMAP,
    mapTypeControlOptions: {
      style: google.maps.MapTypeControlStyle.HORIZONTAL_BAR,
      position: google.maps.ControlPosition.TOP_CENTER
    },
    streetViewControl: true,
    streetViewControlOptions: {
      position: google.maps.ControlPosition.TOP_LEFT
    },
    zoomControl: true,
    zoomControlOptions: {
      position: google.maps.ControlPosition.LEFT_TOP
    }

  });
  map.setZoom(10); // This will trigger a zoom_changed on the map
  map.setCenter(new google.maps.LatLng(46.6199, 10.5924));


  directionsDisplay.setMap(map);
  geocoderService = new google.maps.Geocoder();
  directionsService = new google.maps.DirectionsService;

  var marker = new google.maps.Marker({
    position: new google.maps.LatLng(46.6199, 10.5924),
    map: map,
    draggable: true
  });
  var marker2 = new google.maps.Marker({
    position: new google.maps.LatLng(46.4693, 10.3731),
    map: map,
    draggable: true
  });

  calcolapercorso(tipodipercorso);

}



function calcolapercorso(tipodipercorso) {

  var request = {
    origin: new google.maps.LatLng(46.6199, 10.5924),
    destination: new google.maps.LatLng(46.4693, 10.3731),
    optimizeWaypoints: false,
    avoidHighways: true,
    region: "IT",


    travelMode: google.maps.TravelMode.DRIVING,
    drivingOptions: {
      departureTime: new Date('2016-08-11T00:00:00'),
      trafficModel: google.maps.TrafficModel.PESSIMISTIC
    }

  };
  //request.travelMode = google.maps.DirectionsTravelMode.DRIVING;
  request.unitSystem = google.maps.UnitSystem.METRIC;

  directionsService.route(request, function(response, status) {

    if (status == google.maps.DirectionsStatus.OK) {

      var polyLine = {
        strokeColor: "#2B8B3F",
        strokeOpacity: 1,
        strokeWeight: 4,
      };

      directionsDisplay.setOptions({
        polylineOptions: polyLine,
        suppressMarkers: true
      });


      directionsDisplay.setDirections(response);

    } else if (status == google.maps.DirectionsStatus.ZERO_RESULTS) {
      alert("Could not find a route between these points");
    } else {
      alert("Directions request failed");
    }
  });
}

1 个答案:

答案 0 :(得分:1)

我发现当你设置任何航点时,departureTime选项都不起作用(至少在谷歌地图Javascript API中。我没有确认RestAPI)。 没有路标,它就有用了。

enter image description here

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <style type="text/css">
    #map_canvas {
      width: 600px;
      height: 400px;
      border: 1px solid gray;
      float: left;
    }
    #direction_panel {
      width: 250px;
      height: 400px;
      border: 1px solid gray;
      overflow-y:scroll;
    }
    </style>
    <script src="https://maps.googleapis.com/maps/api/js?language=en&v=3.exp&client=[YOUR_CLIENT_ID]"></script>
    <script>
      function initialize() {
        var mapDiv = document.getElementById("map_canvas");
        var map = new google.maps.Map(mapDiv, {
          mapTypeId: google.maps.MapTypeId.ROADMAP
        });

        var form = document.getElementById("form");
        google.maps.event.addDomListener(form, "submit", function(event) {
          if (event.preventDefault) {
            event.preventDefault();
          } else {
            event.cancelBubble = true;
            event.returnValue = false;
          }
          map.set("traffic", google.maps.TrafficModel[this.trafficModel.value]);
        });

        var directionsService = new google.maps.DirectionsService();
        map.set("directionsService", directionsService);

        var panelDiv = document.getElementById("direction_panel");

        var directionsRenderer = new google.maps.DirectionsRenderer({
          map: map,
          panel: panelDiv
        });
        map.set("directionsRenderer", directionsRenderer);

        map.addListener("traffic_changed", onTrafficModelChanged);
      }

      function onTrafficModelChanged() {
        var map = this;
        var departureDateTime = document.getElementById("departureTime").value;
        var directionsService = map.get("directionsService");
        var directionsRenderer = map.get("directionsRenderer");
        var trafficModel = map.get("traffic");

        var request = {
          origin: "<YOUR ORIGIN>",
          destination: "<YOUR DESTINATION>",
          travelMode: google.maps.TravelMode.DRIVING,
          drivingOptions: {
            departureTime: new Date(departureDateTime),
            trafficModel: trafficModel
          }
        };

        directionsService.route(request, function(result, status) {
          if (status != google.maps.DirectionsStatus.OK) {
            alert(status);
            return;
          }
          directionsRenderer.setDirections(result);
        });
      }

      google.maps.event.addDomListener(window, "load", initialize);
    </script>
  </head>
  <body>
    <div id="frame">
      <div id="map_canvas"></div>
      <div id="direction_panel"></div>
    </div>
    <form id="form">
    Departure Time: <input type="text" id="departureTime" size=40 value="2016/01/25 21:00 PST"><br>
      <input type="radio" name="trafficModel" value="OPTIMISTIC">Optimistic
      <input type="radio" name="trafficModel" value="BEST_GUESS" checked>BEST_GUESS
      <input type="radio" name="trafficModel" value="PESSIMISTIC">PESSIMISTIC
      <input type="submit" value="Search">
    </form>
  </body>
</html>