利用百度api接口查询公交站台经纬度

最新推荐文章于 2023-03-03 09:31:47 发布

weixin_45853880

最新推荐文章于 2023-03-03 09:31:47 发布

阅读量712

点赞数

分类专栏：查询城市公交站台经纬度文章标签： javascript

原文链接：https://www.bilibili.com/video/BV1wJ411x7Da

版权

查询城市公交站台经纬度专栏收录该内容

1 篇文章 0 订阅

订阅专栏

利用百度api接口查询公交站台经纬度

- 查询泰和城市的公交路线
- 详请代码

查询泰和城市的公交路线

详请代码

// An highlighted block
 
<!DOCTYPE html> 
<html> 
<head> 
<meta charset="utf-8" /> 
<title>获取公交站点坐标</title> 
<style type="text/css"> 
html,body{ height: 100%;} 
#results,#coordinate{ display: inline-block; width: 45%; min-height: 200px; border:1px solid #e4e4e4; vertical-align: top;} 
</style> 
<script src="http://api.map.baidu.com/api?v=1.3" type="text/javascript"></script> 
</head> 
<body> 
<p><label for="busId">公交线路：</label><input type="text" value="521" id="busId" /><input type="button" id="btn-search" value="查询" /></p> 
<div id="results"></div> 
<div id="coordinate"></div> 
<script type="text/javascript"> 
(function(){ 
var tempVar; 
var busline = new BMap.BusLineSearch('泰和',{ 
renderOptions:{panel:"results"}, 
onGetBusListComplete: function(result){ 
if(result) { 
tempVar = result;//此时的结果并不包含坐标信息，所以getCoordinate函数不能在此调用。通过跟踪变量，坐标是在onGetBusListComplete之后才被百度的包添加进来的 
busline.getBusLine(result.getBusListItem(0)); 
} 
}, 
// api文档中一共有四个回调，除了onGetBusListComplete和onBusLineHtmlSet之外，还有onBusListHtmlSet和onGetBusLineComplete， 
// 经过测试只有在onBusLineHtmlSet这一步（线路格式化完毕）的时候，才会将坐标添加到tempVar中 
// 所以上面busline.getBusLine(result.getBusListItem(0));是必须的，不然没有办法获得坐标列表 
onBusLineHtmlSet : function(){ 
try{ 
getCoordinate(tempVar); 
}catch(e){ 
} 
} 
}); 
function getCoordinate(result){ 
var coordinate = document.getElementById("coordinate"); 
var stations = result['0']._stations; 
var html = []; 
stations.forEach(function(item){ 
html.push('<li>' + item.name + ' ' + item.position.lng + ' ' + item.position.lat + '</li>'); 
}); 
coordinate.innerHTML = '<ul>' + html.join('') + '</ul>'; 
} 
document.getElementById('btn-search').onclick = function(){ 
busline.getBusList(document.getElementById("busId").value); 
} 
})(); 
</script> 
</body> 
</html>