在谷歌地图上绘制路线 [英] plotting a route on Google Maps

问题描述

我将如何使用 Google Maps API 绘制路线?例如，将一堆路径点加载到地图上(我目前有这个)并从每个路径点画一条线，向用户显示他们可以采取的路线以查看所有路径?当用户看到地图时，我将如何加载它?

How would I use Google Maps API to plot a route? E.g to have a bunch of way points loaded onto the map (I currently have this) and draw a line from each of them showing the user a route they could take to see all of them? How would I then load this up when the user see's the map?

推荐答案

您可以在 DirectionsService 对象，它将通过阵列中的所有点绘制从源到目的地的路线:

You can set the waypoints property on a DirectionsService object and it will plot the route from the source to the destination via all the points in your array:

中间航点数组.路线将根据始发地到目的地的方式此数组中的每个航点.

Array of intermediate waypoints. Directions will be calculated from the origin to the destination by way of each waypoint in this array.

一旦你设置了waypoints 属性，你就可以调用 route 方法来计算方向:

Once you have set the waypoints property, you call the route method to calculate the directions:

route(request:DirectionsRequest, callback:function(DirectionsResult, DirectionsStatus)))

获得 DirectionsResult 后，您可以使用 DirectionsRenderer 对象以在 Google 地图上呈现结果.

Once you have your DirectionsResult, you can use the DirectionsRenderer object to render the results on a Google Map.

更新工作示例

以下代码通过三个航路点的数组在硬编码的起点和终点之间发出方向请求:

The following code makes a direction request between hardcoded start and end points via an array of three waypoints:

// three points through which the directions pass
var point1 = new google.maps.LatLng(-33.8975098545041,151.09962701797485);
var point2 = new google.maps.LatLng(-33.8584421519279,151.0693073272705);
var point3 = new google.maps.LatLng(-33.84525521656404,151.0421848297119);

// build an array of the points
var wps = [{ location: point1 }, { location: point2 }, {location: point3}];

// set the origin and destination
var org = new google.maps.LatLng ( -33.89192157947345,151.13604068756104);
var dest = new google.maps.LatLng ( -33.69727974097957,150.29047966003418);

var request = {
        origin: org,
        destination: dest,
        waypoints: wps,
        travelMode: google.maps.DirectionsTravelMode.DRIVING
        };

您可以在此处(来源).

注意请记住，除非您切换到企业帐户，否则您最多只能在阵列中使用八个航点.

N.B. Keep in mind you can only use up to eight waypoints in your array, unless you switch to a business account.

这篇关于在谷歌地图上绘制路线的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！