您的位置：首页 > Web前端 > HTML5

基于百度地图的HTML5地理位置定位实例

2015-10-29 00:00 681 查看

摘要: 基于百度地图的HTML5地理位置定位实例

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<script type="text/javascript" src="http://api.map.baidu.com/api?v=1.3"></script>
<script type="text/javascript">
function getLocation()
{
if(navigator.geolocation){
navigator.geolocation.getCurrentPosition(showMap, handleError, {enableHighAccuracy:true, maximumAge:1000});
}else{
alert("您的浏览器不支持使用HTML 5来获取地理位置服务");
}
}

function showMap(value)
{
var longitude = value.coords.longitude;
var latitude = value.coords.latitude;
var map = new BMap.Map("map");
var point = new BMap.Point(longitude, latitude);    // 创建点坐标
map.centerAndZoom(point, 15);
var marker = new BMap.Marker(new BMap.Point(longitude, latitude));  // 创建标注
map.addOverlay(marker);              // 将标注添加到地图中
}

function handleError(value)
{
switch(value.code){
case 1:
alert("位置服务被拒绝");
break;
case 2:
alert("暂时获取不到位置信息");
break;
case 3:
alert("获取信息超时");
break;
case 4:
alert("未知错误");
break;
}
}

function init()
{
getLocation();
}

window.onload = init;

</script>
</head>
<body>
<div id="map" style="width:600px;height:600px;"></div>
</body>
</html>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签： 百度地图

相关文章推荐

新的分享

章节导航