使用百度地图api实现根据地址查询经纬度
<htmlxmlns="http://www.w3.org/1999/xhtml">
<head>
<title>根据地址查询经纬度</title>
<metahttp-equiv="Content-Type"content="text/html;charset=utf-8">
<scripttype="text/javascript"src="http://api.map.baidu.com/api?v=1.3"></script>
</head>
<bodystyle="background:#CBE1FF">
<divstyle="width:730px;margin:auto;">
要查询的地址:<inputid="text_"type="text"value="徐州古彭广场"style="margin-right:100px;"/>
查询结果(经纬度):<inputid="result_"type="text"/>
<inputtype="button"value="查询"onclick="searchByStationName();"/>
<divid="container"
style="position:absolute;
margin-top:30px;
width:730px;
height:590px;
top:50;
border:1pxsolidgray;
overflow:hidden;">
</div>
</div>
</body>
<scripttype="text/javascript">
varmap=newBMap.Map("container");
map.centerAndZoom("徐州",12);
map.enableScrollWheelZoom(); //启用滚轮放大缩小,默认禁用
map.enableContinuousZoom(); //启用地图惯性拖拽,默认禁用
map.addControl(newBMap.NavigationControl()); //添加默认缩放平移控件
map.addControl(newBMap.OverviewMapControl());//添加默认缩略地图控件
map.addControl(newBMap.OverviewMapControl({isOpen:true,anchor:BMAP_ANCHOR_BOTTOM_RIGHT})); //右下角,打开
varlocalSearch=newBMap.LocalSearch(map);
localSearch.enableAutoViewport();//允许自动调节窗体大小
functionsearchByStationName(){
map.clearOverlays();//清空原来的标注
varkeyword=document.getElementById("text_").value;
localSearch.setSearchCompleteCallback(function(searchResult){
varpoi=searchResult.getPoi(0);
document.getElementById("result_").value=poi.point.lng+","+poi.point.lat;
map.centerAndZoom(poi.point,13);
varmarker=newBMap.Marker(newBMap.Point(poi.point.lng,poi.point.lat)); //创建标注,为要查询的地方对应的经纬度
map.addOverlay(marker);
varcontent=document.getElementById("text_").value+"<br/><br/>经度:"+poi.point.lng+"<br/>纬度:"+poi.point.lat;
varinfoWindow=newBMap.InfoWindow("<pstyle='font-size:14px;'>"+content+"</p>");
marker.addEventListener("click",function(){this.openInfoWindow(infoWindow);});
//marker.setAnimation(BMAP_ANIMATION_BOUNCE);//跳动的动画
});
localSearch.search(keyword);
}
</script>
</html>
以上就是代码的全部内容了,小伙伴们可以直接使用在项目中哦,不用跟我说谢谢,请叫我雷锋大大~