JavaScript通过百度地图获取公交站点的代码实例

当前位置：首页 > 代码实例 > html5 css3代码分类 > 其他 > JavaScript通过百度地图获取公交站点的代码实例

很多网站都通过使用百度接口来获取一些信息，例如公交站点信息，这样可以增强网站的功能，提高人性化程度，当然更吸引用户，下面就是一段相关的代码实例，希望能够给需要的朋友带来一定的帮助。

[ 其他 ] 运行代码下载代码

<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.51qianduan.com/" />
<title>获取公交站点的位置-51前端</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="581" id="busId" />
  <input type="button" id="btn-search" value="查询" />
</p> 
<div id="results"></div> 
<div id="coordinate"></div> 
<script type="text/javascript"> 
var global={}; 
  global.tempVar={}; 
  global.index=0; 
  global.lineNo=0; 
  var busline=new BMap.BusLineSearch('武汉',{ 
    renderOptions:{panel:"results"}, 
    onGetBusListComplete: function(result){ 
    if(result){ 
      global.tempVar = result; 
    } 
  }, 
  onBusLineHtmlSet:function(){ 
    try{ 
      getCoordinate(global.tempVar); 
    }
    catch(e){} 
  } 
}); 
function $$(id){ 
  return document.getElementById(id); 
} 
function getCoordinate(result){ 
  var coordinate=$$("coordinate"); 
  var stations=result[global.index]._stations; 
  var html=[]; 
  stations.forEach(function(item,index){ 
    html.push('<li>'+global.lineNo+'#'+global.index+'#'+index+'#'+item.name+'#'+item.position.lng+'#'+item.position.lat+'</li>'); 
  }); 
  coordinate.innerHTML='<ul>'+html.join('')+'</ul>'; 
} 
$$('btn-search').onclick=function(){ 
  global.lineNo=$$("busId").value; 
  busline.getBusList(global.lineNo); 
} 
$$('results').addEventListener('click',function(event){ 
  var target = event.target; 
  if('a' == target.tagName.toLowerCase() && 'dt' == target.parentNode.tagName.toLowerCase()){ 
    event.preventDefault(); 
    var tempHtml = target.parentNode.innerHTML; 
    var indexOfValue = tempHtml.indexOf('_selectBusListItem('); 
    global.index = - ( - tempHtml.substring(indexOfValue + '_selectBusListItem('.length,indexOfValue + '_selectBusListItem('.length + 1) ); 
    busline.getBusLine(global.tempVar.getBusListItem(global.index)); 
  } 
},false); 
</script> 
</body> 
</html>

代码描述：JavaScript百度地图获取公交站点。JavaScript通过百度地图获取公交站点的代码实例

下载全部收藏

142 189

用户评论

大牛，别默默的看了，快登录帮我点评一下吧！:) 登录 | 注册