百度地图api,【百度地图API】如何制作公交线路的搜索?如331路

摘要:
从A点到B点的公交导航大家都知道怎么做了,那么单独查询331路公交车的公交路线,如何制作呢?我们一起来学习一下~
-----------------------------------------------------------------------------------------------------------------

一、创建地图和网页样式
两句话建立地图:
var map = new BMap.Map("container"); map.centerAndZoom(new BMap.Point(116.322, 40.003), 12);


然后把网页结构搭建好。有一张图片,一个文本框,一个按钮。还有一张地图。
CSS样式我就直接给出了,这里就不多说了。大家可以去W3Cschool学习~~这是我最爱的网站:http://www.w3school.com.cn/css/index.asp
搜索331路公�

 路公� ="busSearch();" />

 



效果图:
【百度地图API】如何制作公交线路的搜索?如331路百度地图api

二、公交线路接�
先来看看百度地图API给出的接口类参考:
【百度地图API】如何制作公交线路的搜索?如331路百度地图api

使用构造函数,创建一个公交线路的查询。并在renderOptions里设置查询成功后,结果的展示�
var busline = new BMap.BusLineSearch(map,{ renderOptions:{map:map,panel:"results"}, _disibledevent=>function(result){ if(result) { var fstLine = result.getBusListItem(0);//获取第一个公交列表显示到map� busline.getBusLine(fstLine); } } });


创建一个函数,获取到文本框中输入的“331”路公交车,(还可以输�104,或�987,注意,只能支持数字)然后,执行查询�
function busSearch(){ var busName = document.getElementById("busId").value; busline.getBusList(busName); }


效果图:
【百度地图API】如何制作公交线路的搜索?如331路百度地图api


全部源代码:
搜索331路公�

 路公� ="busSearch();" />

 


Tags:  百度地图的api 百度地图api

延伸阅读

最新评�

发表评论