如何制作多途经点的线路导航

马小跳吃胡萝卜

<script type="text/javascript" src="链接"></script>

大家跟我一起来创建一张简单的地图：

var map = new BMap.Map("container");map.centerAndZoom(new BMap.Point(11
6.404, 3
9.915), 13);

然后为地图加上一些合适的控件：

map.addControl(new BMap.NavigationControl());               // 添加平移缩放控件map.addControl(new BMap.ScaleControl());                    // 添加比例尺控件map.addControl(new BMap.OverviewMapControl());              //添加缩略地图控件

我手工找到的重庆、西安、北京三个城市的坐标点，使用坐标拾取工具（请点击）可以轻松找到这三个经纬度。

当然，你也可以使用localsearch类的search方法。这个可以随意。

找到坐标点之后，创建三个点对象。

var myP1 = new BMap.Point(10
6.521436,2
9.532288);    //起点-重庆var myP2 = new BMap.Point(10
8.983569,3
4.285675);    //终点-西安var myP3 = new BMap.Point(11
6.404449,3
9.920423);    //终点-北京

二、创建一个驾车导航和两个驾车搜索

好啦，现在来创建一个驾车导航吧~

这句话是不是很简单？用这句话就可以创建驾车导航啦。

var driving = new BMap.DrivingRoute(map);    //创建驾车实例

然后写两个搜索方法：

第一个是搜索从重庆到西安的，第二个是从西安到北京的。

driving.search(myP1, myP2);                 //第一个驾车搜索driving.search(myP2, myP3);                 //第二个驾车搜索

三、自己绘制折线

接下来，我们在回调函数setSearchCompleteCallback中，把搜索完毕的路线绘制出来。

注意哦，这里是两个搜索的路线都绘制出来了哦~~

就这么简单的三句话，很简单吧。

第一句、获取数组

第二句、创建折线

第三句、添加折线覆盖物

   driving.setSearchCompleteCallback(function(){        var pts = driving.getResults().getPlan(0).getRoute(0).getPath();    //通过驾车实例，获得一系列点的数组        var polyline = new BMap.Polyline(pts);            map.addOverlay(polyline);}

这个时候，整个驾车导航就是这个样子滴，简直充满了喜感，像一条蚯蚓呢  O(∩_∩)O~

汉娜