<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>根據(jù)地址查詢經(jīng)緯度</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=申請的ak值"></script>
<script type="text/javascript" src="http://wap.bingjun.cn/js/jquery-1.9.2.min.js"></script>
<script type="text/javascript" src="http://wap.bingjun.cn/js/layer/layer.js"></script>
<script type="text/javascript">
$(function(){
var map = new BMap.Map("container");
map.centerAndZoom("北京", 12);//地圖默認(rèn)北京
map.enableScrollWheelZoom(); //啟用滾輪放大縮小,默認(rèn)禁用
map.enableContinuousZoom(); //啟用地圖慣性拖拽扮念,默認(rèn)禁用
map.addControl(new BMap.NavigationControl()); //添加默認(rèn)縮放平移控件
map.addControl(new BMap.OverviewMapControl()); //添加默認(rèn)縮略地圖控件
map.addControl(new BMap.OverviewMapControl({ isOpen: true, anchor: BMAP_ANCHOR_BOTTOM_RIGHT })); //右下角葵蒂,打開
var localSearch = new BMap.LocalSearch(map);
localSearch.enableAutoViewport(); //允許自動調(diào)節(jié)窗體大小
//根據(jù)地址查詢移除事件
$("#text_").blur(function(){
searchByStationName();
});
});
</script>
<script type="text/javascript">
var text;
var geolocation = new BMap.Geolocation();
var myGeo = new BMap.Geocoder();
geolocation.getCurrentPosition(function(result){
if(this.getStatus() == BMAP_STATUS_SUCCESS){
var pt=result.point;
myGeo.getLocation(pt, function(result){
if (result){
var addComp = result.addressComponents;
//獲取地址詳情
var address = addComp.province + addComp.city + addComp.district + addComp.street + addComp.streetNumber;
text=address;
$("#text_").val(text);
searchByStationName();
}
});
}
});
//獲取經(jīng)緯度顯示到文本(可以自由發(fā)揮)
function searchByStationName() {
var map = new BMap.Map("container");
var local = new BMap.LocalSearch(map, {
renderOptions: { map: map }
});
var keyword = document.getElementById("text_").value;
local.setSearchCompleteCallback(function (searchResult) {
var poi = searchResult.getPoi(0);
document.getElementById("result_").value = poi.point.lng + "," + poi.point.lat; //獲取經(jīng)度和緯度,將結(jié)果顯示在文本框中
map.centerAndZoom(poi.point, 13);
});
local.search(keyword);
}
</script>
</head>
<body style="background:#CBE1FF">
<div style="width:1200px;margin:auto;">
要查詢的地址:<input id="text_" type="text" value="" style="margin-right:100px;"/>
查詢結(jié)果(經(jīng)緯度):<input id="result_" type="text" />
<div id="container" style="width: 1200px; height: 900px;border: 1px solid gray;">
</div>
</div>
</body>
</html>