路线规划 最后更新时间: 2024年07月05日

路线规划的方式有多种，包括驾车、公交、步行、骑乘和货车等。每种路线规划方式都有相对应的插件。本文以驾车路线规划服务插件AMap.Driving为例，向你介绍：

1. 获取驾车路线规划数据
2. 使用默认 UI 显示驾车路线详情
3. 使用驾车规划拖拽插件AMap.DragRoute编辑路线
4. 其它路线规划插件介绍

驾车规划路线示例

1、获取驾车路线规划数据

在使用插件之前，需要先引入插件。本文的所有示例均采用异步引入的方式。有关该插件的更多引入方式前往 插件的使用。

获取驾车路线规划一般有两种方式：关键字和经纬度，下面将分别介绍这两种方式。

1.1 使用关键字获取驾车规划数据

通过传入起点、终点的地址信息，获取对应的驾车路线规划。假如要从北京市地震局（公交站）坐车去亦庄文化园（地铁站），一次完整的查询如下：

AMap.plugin("AMap.Driving", function () {
  var driving = new AMap.Driving({
    policy: 0, //驾车路线规划策略，0是速度优先的策略
  });
  var points = [
    { keyword: "北京市地震局（公交站）", city: "北京" },
    { keyword: "亦庄文化园（地铁站）", city: "北京" },
  ];
  driving.search(points, function (status, result) {
    //status：complete 表示查询成功，no_data 为查询无结果，error 代表查询错误
    //查询成功时，result 即为对应的驾车导航信息
  });
});

1.2 使用经纬度获取驾车规划数据

通过传入起点和终点的经纬度信息，获取对应的驾车路线规划。假如从北京南站驾车到北京站接朋友，一次完整的查询如下：

AMap.plugin("AMap.Driving", function () {
  var driving = new AMap.Driving({
    policy: 0, //驾车路线规划策略，0是速度优先的策略
  });
  var startLngLat = [116.379028, 39.865042]; //起始点坐标
  var endLngLat = [116.427281, 39.903719]; //终点坐标
  driving.search(startLngLat, endLngLat, function (status, result) {
    //status：complete 表示查询成功，no_data 为查询无结果，error 代表查询错误
    //查询成功时，result 即为对应的驾车导航信息
  });
});

1.3 添加途经点参数

前面两节介绍了通过关键字、经纬度方式获取驾车规划数据，并且都只传入了起点和终点。实际上AMap.Driving还支持发起路线规划时传入途经点数据，同样支持关键字和经纬度两种写法。使用方式请参考下面的代码示例：

使用关键字方式添加途径点

AMap.plugin("AMap.Driving", function () {
  var driving = new AMap.Driving({
    policy: 0, //驾车路线规划策略，0是速度优先的策略
  });
  var points = [
    { keyword: "北京市地震局（公交站）", city: "北京" }, //起始点
    { keyword: "北京站", city: "北京" }, //设置途经点参数，最多支持传入16个途经点
    { keyword: "亦庄文化园（地铁站）", city: "北京" }, //终点
  ];
  driving.search(points, function (status, result) {
    //status：complete 表示查询成功，no_data 为查询无结果，error 代表查询错误
    //查询成功时，result 即为对应的驾车导航信息
  });
});

使用经纬度方式添加途径点

AMap.plugin("AMap.Driving", function () {
  var driving = new AMap.Driving({
    policy: 0, //驾车路线规划策略，0是速度优先的策略
  });
  var startLngLat = [116.379028, 39.865042]; //起始点坐标
  var endLngLat = [116.427281, 39.903719]; //终点坐标
  var opts = {
    waypoints: [[116.397455,39.909187]], //途经点参数，最多支持传入16个途经点
  };
  driving.search(startLngLat, endLngLat, opts, function (status, result) {
    //status：complete 表示查询成功，no_data 为查询无结果，error 代表查询错误
    //查询成功时，result 即为对应的驾车导航信息
  });
});

opts参数除了可以传入经纬度外，还支持传入关键词

var opts = {
  waypoints: [{ keyword: "北京站", city: "北京" }], //途经点参数，最多支持传入16个途经点
};

2、使用默认 UI 显示驾车路线规划

使用AMap.Driving获取驾车路线规划发起搜索后，需要开发者根据返回的路线方案数据结构自行显示路线详情并结合AMap.Polyline绘制到地图上。为了帮助开发者节省时间、提升效率。JS API 提供了默认的 UI，自动在地图上显示结构化的路线详情。如果你需要使用此功能，请按照下面代码示例编写即可：

AMap.plugin("AMap.Driving", function () {
  var driving = new AMap.Driving({
    //驾车路线规划策略，0是速度优先的策略
    policy: 0, 
    //map 指定将路线规划方案绘制到对应的 AMap.Map 对象上
    map: map,
    //panel 指定将结构化的路线详情数据显示的对应的 DOM 上，传入值需是 DOM 的 ID
    panel: "my-panel", 
  });
  var points = [
    { keyword: "北京市地震局（公交站）", city: "北京" },
    { keyword: "亦庄文化园（地铁站）", city: "北京" },
  ];
  //搜索完成后，将自动绘制路线到地图上
  driving.search(points);
});

3、使用驾车规划拖拽插件编辑路线

除了通过经纬度和关键字进行驾车路线规划外，还可以使用拖拽插件辅助做驾车路线规划。下面是结合了拖拽插件的驾车路线规划示例：

AMap.plugin("AMap.DragRoute", function () {
  //path 是驾车导航的起、途径和终点，最多支持16个途经点
  var path = [];
  path.push([116.303843, 39.983412]);
  path.push([116.321354, 39.896436]);
  path.push([116.407012, 39.992093]);
  var route = new AMap.DragRoute(map, path, 0);
  //查询导航路径并开启拖拽导航
  route.search();
});

4、其它路线规划插件介绍

除驾车路线规划外，高德  JS API  还提供了其它几种常用的出行路线规划

公交路线规划AMap.Transfer

步行路线规划AMap.Walking

骑行路线规划AMap.Riding

货车路线规划AMap.TruckDriving

5、本章涉及的属性及方法说明

5.1 AMap.Driving

5.2 AMap.DragRoute