百度地图javascript api实现定位
百度地图API:http://api.map.baidu.com/lbsapi/cloud/
开发前需要先申请密钥(key)
在访问位置信息前,浏览器都会询问用户是否共享其位置信息,以Chrome浏览器为例,如果您允许Chrome浏览器与网站共享您的位置,Chrome浏览器会向Google位置服务发送本地网络信息,估计您所在的位置。然后,浏览器会与请求使用您位置的网站共享您的位置。
经过测试发现,目前的浏览器定位技术依然不靠谱,误差很大,基本没有实用性。
<!DOCTYPEhtml>
<html>
<head>
<metahttp-equiv="Content-Type"content="text/html;charset=utf-8"/>
<styletype="text/css">
body,html,#allmap{width:100%;height:100%;overflow:hidden;margin:0;}
#l-map{height:100%;width:78%;float:left;border-right:2pxsolid#bcbcbc;}
#r-result{height:100%;width:20%;float:left;}
</style>
<scripttype="text/javascript"src="http://api.map.baidu.com/api?v=1.5&ak=8704bb2733e7bbfd5fbd7ddb73861d87"></script>
<title>地图官网展示效果</title>
</head>
<body>
<divid="allmap"></div>
</body>
</html>
<scripttype="text/javascript">
varmap=newBMap.Map("allmap");//创建Map实例
varenableBaiduLocation=false;//暂时不用百度自带的浏览器定位接口
if(enableBaiduLocation){
varpoint=newBMap.Point(116.331398,39.897445);
map.centerAndZoom(point,15);
vargeolocation=newBMap.Geolocation();
geolocation.getCurrentPosition(function(r){
if(this.getStatus()==BMAP_STATUS_SUCCESS){
varmk=newBMap.Marker(r.point);
map.addOverlay(mk);
map.panTo(r.point);
alert('您的位置:'+r.point.lng+','+r.point.lat);
}
else{
alert('failed'+this.getStatus());
}
},{enableHighAccuracy:true})
}else{
if(navigator.geolocation){
navigator.geolocation.getCurrentPosition(successFunction,errorFunction,{
enableHighAcuracy:true,
timeout:5000
});
}else{
alert('ItseemslikeGeolocation,whichisrequiredforthispage,isnotenabledinyourbrowser.Pleaseuseabrowserwhichsupportsit.');
}
}
functionsuccessFunction(position){
varlatitude=position.coords.latitude;//维度
varlongitude=position.coords.longitude;//经度
varcurPoint=newBMap.Point(longitude,latitude);
map.centerAndZoom(curPoint,15);//初始化地图,设置中心点坐标和地图级别
map.addControl(newBMap.NavigationControl());//添加平移缩放控件
map.addControl(newBMap.ScaleControl());//添加比例尺控件
map.addControl(newBMap.OverviewMapControl());//添加缩略地图控件
map.enableScrollWheelZoom();//启用滚轮放大缩小
map.addControl(newBMap.MapTypeControl());//添加地图类型控件
map.setCurrentCity("成都");//设置地图显示的城市此项是必须设置的
varmarker1=newBMap.Marker(curPoint);//创建标注
map.addOverlay(marker1);//将标注添加到地图中
map.addEventListener("click",function(e){
alert("点击坐标:"+e.point.lng+","+e.point.lat);
});
}
functionerrorFunction(){
alert("error");
}
</script>