迁移到 Route 类

新的 Maps JavaScript API 路线库包含 Route 类,该类取代了旧版路线服务。本页介绍了旧版 Directions 服务与新版 Route 类之间的区别,并提供了一些代码以供比较。

路线服务(旧版)与路线类(Beta 版)

请求参数

下表比较了旧版 Directions 服务和 Route 类的请求参数。

路线服务(旧版) Route(Beta 版)
DirectionsService.route() 方法 Route.computeRoutes() 方法

必需参数

origin origin
destination destination
travelMode travelMode(可选)

可选参数

optimizeWaypoints optimizeWaypointOrder
provideRouteAlternatives computeAlternativeRoutes
avoidFerriesavoidHighwaysavoidTolls routeModifiers
drivingOptions departureTimetrafficModel
region region
transitOptions transitPreference
arrivalTime arrivalTime
unitSystem units
waypoints intermediates

方法比较

下表比较了旧版 Directions 服务和 Route 类的主要方法。

路线服务(旧版) Route(Beta 版)
route() 方法 computeRoutes() 方法
DirectionsRenderer.setDirections() 方法 createPolylines() 方法createWaypointAdvancedMarkers() 方法

代码比较

本部分将比较两段类似的代码,以说明旧版 Directions 服务与新版 Route 类之间的区别。这些代码段展示了在每个相应 API 上发出路线请求所需的代码,然后使用结果在地图上绘制折线和标记。

在旧版路线服务中,DirectionsRenderer 对象用于显示多段线和标记,以在地图上表示路线结果。在 Routes 库中,DirectionsRenderer 对象已被 createPolylines()createWaypointAdvancedMarkers() 方法取代。本页介绍了旧版 Directions 服务与新的 Route 类之间的差异,并提供了一些代码以供比较。

查询驾车路线

路线服务(旧版)

以下代码使用旧版“路线”服务获取驾车路线,然后使用 DirectionsRenderer 在地图上绘制折线和标记:

// Define a simple request.
var request = {
  origin: 'Mountain View, CA',
  destination: 'San Francisco, CA',
  travelMode: 'DRIVING'
};
// Call the Directions Service to get the directions.
directionsService.route(request, function(result, status) {
  if (status == 'OK') {
    directionsRenderer.setDirections(result); // Add polyline and markers to the map.
  }
});

路线类(Beta 版)

以下代码使用新的 Route 类获取驾车路线,然后使用 createPolylines 方法在地图上绘制多段线,并使用 createWaypointAdvancedMarkers 方法在地图上绘制标记。

新的 Route 类不会自动渲染标记。您必须调用 createWaypointAdvancedMarkers 才能渲染标记。

// Define a simple request.
const request = {
  origin: 'Mountain View, CA',
  destination: 'San Francisco, CA',
  travelMode: 'DRIVING',
  fields: ['path', 'legs'], // Request fields needed to draw polylines.
};

// Call computeRoutes to get the directions.
const {routes} = await Route.computeRoutes(request);

// Use createPolylines to create a polyline for the route.
mapPolylines = routes[0].createPolylines();
// Add polylines to the map
mapPolylines.forEach((polyline) => polyline.setMap(map));

// Create markers to start and end points.
const markers = await routes[0].createWaypointAdvancedMarkers();
// Add markers to the map
markers.forEach((marker) => marker.setMap(map));