0

正如标题所提到的,我正在尝试创建一个地图,该地图呈现一个单一的起点,并为多个目的地(而不是航路点)呈现方向。我设法通过大量重复代码实现了这一点。但是,我想将代码整合到一个可重用的 javascript 对象中,但遇到了挑战,可能需要对事物进行适当的范围界定?

这是我遇到的错误:

Uncaught TypeError: Cannot call method 'setDirections' of undefined

Javascript代码:

google.maps.event.addDomListener(window, 'load', initialize); 
var directionsDisplay;
var map;
var route1 = new route();
var route2 = new route();
var route3 = new route();
var route4 = new route();

function initialize() {
  var austin = new google.maps.LatLng(30.2669, -87.7428);
  var mapOptions = {
      zoom: 7,
      mapTypeId: google.maps.MapTypeId.ROADMAP,
      center: austin
  }
  map = new google.maps.Map(document.getElementById("map-canvas"), mapOptions);
}

function route() {
  this.directionsService = new google.maps.DirectionsService();
  this.directionsDisplay = new google.maps.DirectionsRenderer();
  this.directionsDisplay.setMap(map);
  //alert(JSON.stringify(this.directionsDisplay));

  this.calcRoute = calcRoute;

  function calcRoute(end) {
      if (end === undefined) {
          end = "New York";
      }
      var start = document.getElementById("start").value;
      var request = {
          origin: start,
          destination: end,
          travelMode: google.maps.TravelMode.DRIVING
      };
      this.directionsService.route(request, function (result, status) {
          if (status == google.maps.DirectionsStatus.OK) {
              alert(JSON.stringify(this.directionsService));
              this.directionsDisplay.setDirections(result);
          }
      });
  }
}

HTML 看起来像这样:

<select id="loc1" onchange="route1.calcRoute(getElementById('loc1').value);">
<option value="123 Anywhere lane NY">my Address</option>

如何解决错误并显示具有一个起点和多个终点的地图?

4

1 回答 1

0

DirectionsService 受配额和费率限制。如果您处理 OVER_QUERY_LIMIT 情况并退出,您可以检索多个路由。

这样做的几个例子:

于 2013-07-22T23:32:51.390 回答