43,739
社区成员
发帖
与我相关
我的任务
分享
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(locationSuccess, locationError, {
// 指示浏览器获取高精度的位置,默认为false
enableHighAccuracy: true,
// 指定获取地理位置的超时时间,默认不限时,单位为毫秒
timeout: 5000,
// 最长有效期,在重复获取地理位置时,此参数指定多久再次获取位置。
maximumAge: 3000
});
} else {
alert("Your browser does not support Geolocation!");
alert("浏览器不支持html5来获取地理位置信息");
}
function locationSuccess(position) {
// 获取到当前位置经纬度 本例中是chrome浏览器取到的是google地图中的经纬度
var lng = position.coords.longitude;
var lat = position.coords.latitude;
alert(lng);
alert(lat);
//console.log(lng);
//console.log(lat);
// 调用百度地图api显示
var map = new BMap.Map("Map");
var point = new BMap.Point(lng, lat);
var marker = new BMap.Marker(point); // 创建标注'
map.addOverlay(marker);
map.centerAndZoom(point, 15);
map.addControl(new BMap.NavigationControl());
function locationError(error){
switch(error.code) {
case error.TIMEOUT:
showError("A timeout occured! Please try again!连接超时,请重试 ");
break;
case error.POSITION_UNAVAILABLE:
showError('We can\'t detect your location. Sorry!亲爱的火星网友,非常抱歉,我们暂时无法为您所在的星球提供位置服务');
break;
case error.PERMISSION_DENIED:
showError('Please allow geolocation access for this to work.您拒绝了使用位置共享服务,查询已取消');
break;
case error.UNKNOWN_ERROR:
showError('An unknown error occured!');
break;
}
}
function showError(error) { console.log(error); }
<!DOCTYPE html>
<html>
<head>
<title>H5地理位置Demo</title>
<script src="http://api.map.baidu.com/api?v=2.0&ak=B890bb83a6cf9664b3428b3fcb2506f2" type="text/javascript">
</script>
</script>
</head>
<body>
<div id="Map" style="width:600px; height:400px">
</div>
<div id="allmap" style="width:600px; height:400px">
</div>
</body>
<script>
Js放这里就可以了
</script>
</html>