使用Google Maps 3 API在地图上获取多条路线

Pur*_*tha 15 google-maps

我正在研究车辆路径问题.最近我花了一些时间浏览Google Maps API,看看我是否可以在同一张地图上打印多条路线.我想要以下:route1:指向a,b,c,路线2点a,d,e,f,路线3点a,g,h,a和我希望每条路线都有不同的颜色折线.有人可以帮我弄这个吗.

Bil*_*hip 25

是的,这很简单,一旦掌握了它.

您想使用directionsRenderer对象.

最重要的是你希望你的路由都在数组中设置,然后你想通过循环迭代它们.每次创建一个新的directionsRenderer对象,并每次将其设置为地图.在循环内部,您还需要创建一个新的折线变量,每次都传递给directionsRenderer,颜色不同.我用了一些代码来做到这一点,但目前还不知道它在哪里.

以下是使用不同颜色折线的人的示例.:

http://www.geocodezip.com/violette_com_TestMap2c.html

如果您专注于以下两行代码,您将看到如何设置折线颜色以及如何将其传递给directionsRenderer.

directionsDisplayActual = new google.maps.DirectionsRenderer({suppressMarkers: true, polylineOptions: polylineOptionsActual})

var polylineOptionsActual = {
      strokeColor: '#FF0000',
      strokeOpacity: 1.0,
      strokeWeight: 10
      };
Run Code Online (Sandbox Code Playgroud)

您的路线的下一个路标.:

http://code.google.com/apis/maps/documentation/javascript/examples/directions-waypoints.html

另一个好例子.

var request = {
    origin: start, 
    destination: end,
    waypoints: waypts,
    optimizeWaypoints: true,
    travelMode: google.maps.DirectionsTravelMode.DRIVING
};
directionsService.route(request, function(response, status) {
Run Code Online (Sandbox Code Playgroud)

如果您专注于谷歌示例中的上述代码,您将看到waypts var.这就是你的inbetween标记将被设置的位置(正如你所说的b点).你会做一个waypts.push(.....).起点和终点将是你的a点和b点.

不应该太困难一起拍打东西.我建议抓住一个最符合您需求的谷歌示例,并将其略读到一个简单的项目,然后从那里构建它.