9

将代码从 Javascript API 2 迁移到 3。我有一个位置列表，我需要以行车路线的形式绘制这些位置。这是在 v2 中使用以下代码完成的

directions = new GDirections(map);
directions.loadFromWaypoints(waypoints, {preserveViewport: true});

这是我尝试将其转换为 V3

var request = {
    origin: startLoc,
    destination: endLoc,
    waypoints: waypoints,
    optimizeWaypoints: true,
    travelMode: google.maps.TravelMode.DRIVING
};          

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

不是整个代码，而是总体思路。似乎工作正常，有一个小问题。当航路点超过 8 个时，调用失败。这是预期的，因为Google Maps API v3 Docs声明

允许的最大航路点为 8 个，加上起点和终点。Maps API for Business 客户可以使用 23 个航点，以及起点和目的地。公交路线不支持航点。

由于我在 v2 中没有遇到这个问题，这是 v3 的新限制吗？我想知道我是否使用了不是为我需要的东西而设计的东西。这是一个非常简单的应用程序，有 2 个用户，所以我不确定昂贵的营业执照是否值得回报。尚未退回给 Google 地图团队的电子邮件。任何解决方法/指针都会有很大帮助。谢谢。

4

3 回答 3

12

一种可能的解决方法（特别是对于使用较少的站点）是使用多个 DirectionsService 请求。

于 2013-11-07T23:37:30.243 回答
2

使用应该需要使用这样的数组概念......

directionsService[i].route({                                    
                    'origin': start,
                    'destination': end
                    'waypoints': waypts,
                    'travelMode': 'DRIVING'
                       },
                    function (directions, status){              
                                if (status == google.maps.DirectionsStatus.OK) {
                                    directionsDisplay[j].setDirections(directions);
                                }
                            });

在这些方向服务和方向显示应该是数组逻辑和使用循环概念使用应该需要动态分配开始、结束和航路点并
尝试发送多个请求意味着你将获得 n 个纬度的路线......但标记将是在 8 个航路点后以相同的名称重复，因为我们使用 supressmarkers false 属性删除默认标记...

于 2014-02-21T18:49:00.777 回答
-1

正如其他人所说，使用谷歌的 JavaScript API 是不可能的。但是，Google 确实允许服务器端请求最多 23 个航点。因此，使用 PHP 和 JavaScript，我能够解决问题。

您需要做的是从服务器端请求中获取“航点顺序”，然后让 JavaScript 为您提供每个位置之间的方向。

<?php
  $startLocation = "40.713,-74.0135";
  $endLocation = "40.75773,-73.985708";
  $waypoints = array("40.748433,-73.985656|", "40.689167,-74.044444|");
  $apiKey = "";
  $routeData = json_decode(file_get_contents("https://maps.googleapis.com/maps/api/directions/json?origin=".$startLoc."&destination=".$endLoc."&waypoints=optimize:true|".$waypoints."&key=".$apiKey));
  echo "var waypointsOrder = ". json_encode($routeData->routes[0]->waypoint_order) . ";\n";
?>

var startLocation = {lat: 40.713, lng: -74.0135};
var endLocation = {lat: 40.75773, lng: -73.985708};

//get directions from the origin to the first waypoint
var request = {
    origin: startLocation,
    destination: JSON.parse(places[waypointsOrder[0]][1]),
    travelMode: google.maps.TravelMode.DRIVING
};
directionsService.route(request, function (result, status) {
    if (status == google.maps.DirectionsStatus.OK) {
          renderDirections(result, map);
    }
});

//get directions from the last waypoint to the destination
var request = {
    origin: JSON.parse(places[waypointsOrder[waypointsOrder.length-1]][1]),
    destination: endLocation,
    travelMode: google.maps.TravelMode.DRIVING
};
directionsService.route(request, function (result, status) {
    if (status == google.maps.DirectionsStatus.OK) {
          renderDirections(result, map);
    }
});

//get directions between each waypoint
for (i = 1; i < waypointsOrder.length; i++) {
  var request = {
      origin: JSON.parse(places[waypointsOrder[i-1]][1]),
      destination: JSON.parse(places[waypointsOrder[i]][1]),
      travelMode: google.maps.TravelMode.DRIVING
  };
  directionsService.route(request, function (result, status) {
      if (status == google.maps.DirectionsStatus.OK) {
          renderDirections(result, map);
      }
  });
}

function renderDirections(result, map) {
  var directionsDisplay = new google.maps.DirectionsRenderer ({
    map: map
  });
  directionsDisplay.setMap(map); 
  directionsDisplay.setDirections(result); 
}
于 2016-08-10T07:02:47.947 回答