百度地图API怎么制作驾车导航

这篇文章主要讲解了“百度地图API怎么制作驾车导航”，文中的讲解内容简单清晰，易于学习与理解，下面请大家跟着小编的思路慢慢深入，一起来研究和学习“百度地图API怎么制作驾车导航”吧！

成都创新互联专注为客户提供全方位的互联网综合服务，包含不限于成都做网站、成都网站设计、成都外贸网站建设、定结网络推广、成都小程序开发、定结网络营销、定结企业策划、定结品牌公关、搜索引擎seo、人物专访、企业宣传片、企业代运营等，从售前售中售后，我们都将竭诚为您服务，您的肯定，是我们最大的嘉奖；成都创新互联为所有大学生创业者提供定结建站搭建服务，24小时服务热线：18982081108，官方网址：www.cdcxhl.com

一、创建地图与网页样式

创建一张简单的地图，只需要3句话。

varmap =newBMap.Map("container"); //创建Map实例  varpoint =newBMap.Point(116.404, 39.915); //创建点坐标  map.centerAndZoom(point,15); //初始化地图,设置中心点坐标和地图级别。

然后，我们制作出两个输入框，分别是起点输入框，和终点输入框。

从到  

使用“驾车”按钮，获取输入框中的数据。

functionmDriving(){varstartPlace =document.getElementById("startInput").value;varendPlace =document.getElementById("endInput").value;}

二、创建搜索实例

对于起点和终点，我们需要创建2个不同的搜索实例：

//创建2个搜索实例  varstartSearch =newBMap.LocalSearch(map,startOption);varendSearch =newBMap.LocalSearch(map,endOption);

在点击“驾车”按钮后，开始搜索起点和终点都有哪些符合关键词的地方（POI点）。

functionmDriving(){varstartPlace =document.getElementById("startInput").value;varendPlace =document.getElementById("endInput").value;  startSearch.search(startPlace);  endSearch.search(endPlace);  document.getElementById("box").style.display="block";  }

三、搜索的数据接口

由于AJAX是异步加载的，我们使用百度地图API提供的回调函数onSearchComplete，来完成对搜索成功后的操作。

以起点的搜索为例：

当搜索成功后，把每一个搜索结果（POI），按照我们自定义的方式，列在面板中。其实，这里我们只使用了数据接口，没用百度默认的结果面板。

varstartOption ={  onSearchComplete: function(results){//判断状态是否正确if(startSearch.getStatus() ==BMAP_STATUS_SUCCESS){  startResults =results;vars =[];for(vari =0;i 
");  s.push(results.getPoi(i).title);  s.push("
");  s.push(results.getPoi(i).address);  s.push("