实时公交api的实现，全国200+城市实时精准API

全国200+城市实时精准

接口功能：
1、公交线路查询
2、公交实时位置获取
3、获取附近的公交数据
4、获取附近的地铁数据

立即申请

需求：当外部输入公交线路号，点击查询按钮的时候，会在div上显示所有包含此公交线路号的列表，点击列表中的项，会在百度地图上绘制出其线路。

实现：
第一步：生成线路列表
使用的百度API：服务类中BusLineSearch类是公交线路搜索类。
构造其对象，调用其getBusList方法，在此方法的回调函数OnGetBusListComplete中返回BusListResult类型的公交列表结果

查询
$(“#query”).click(function () {
map.clearOverlays();
busNo = $(‘#keyword’).val();
busutil.getBusList(busNo);
window.localStorage.setItem(“busNo”, busNo);
//设置curItemNo=0，查询后会显示div中第一条线路
curItemNo = 0;
$(“#keyword”).val(“”);
})
回调函数

第二步：列表项点击事件

使用的百度API：服务类中BusLineSearch类是公交线路搜索类，设置curItemNo，再次调用其getBusList方法。

点击
function subgo(itemNo) {
curItemNo = itemNo;
window.localStorage.setItem(“curItemNo”, curItemNo);
busutil.getBusList(busNo);
}

第三步：列表项点击显示具体的线路信息

使用的百度API：服务类中BusLineSearch类是公交线路搜索类，调用其getBusLine方法，其参数为busListItem类型，，在方法的回调函数onGetBusLineComplete中返回类型为BusLine的公交信息。

这个地方比较关键，我们前面获得了BusListResult类型的公交列表结果，其有一个getBusListItem的方法，返回BusListItem类型的结果，表示获取某一个具体的公交列表中的对象。将这个对象传给getBusLine方法，在其回调函数onGetBusLineComplete中画具体线路。
onGetBusLineComplete回调函数
busutil = new BMap.BusLineSearch(“杭州”, {

第四步：画具体线路

使用的百度API：覆盖物类中的Polyline，使用浏览器的矢量制图工具（如果可用）在地图上绘制折线的地图叠加层。
通过调用getBusLine方法，返回busLine类型的对象，其有getPath()方法，返回Array的公交线地理坐标点数组（注意：其array.length要比站点数.length多很多）。

第五步：在polyline上画站点，循环获取其站点信息，并添加Marker到polyline上

使用的百度API：BusLine对象有两个方法，getNumBusStations()获取公交站点个数以及getBusStation(i)，返回值为BusStation，表示获取一个具体的公交站对象。
以及用覆盖物类中的Marker类

第六步：为Marker添加click事件，使其可以显示站点公交的实时信息

百度地图API：使用覆盖物类中的InfoWindow类
最后，要考虑以下几点内容

div中busList选中项与未选项颜色的切换

在百度地图中添加一个反向的按钮控件，参照百度官方API可以实现

地图中选中站点与未选站点的icon切换

立即申请