<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<meta name="keywords" content="天地图"/>
<title>天地图－地图API－范例－H5定位</title>
<script type="text/javascript" src="http://api.tianditu.gov.cn/api?v=4.0&tk=您的密钥"></script>
<style type="text/css">body,html{width:100%;height:100%;margin:0;font-family:"Microsoft YaHei"}#mapDiv{width:100%;height:400px}input,b,p{margin-left:5px;font-size:14px}</style>
<script>
var map;
var zoom = 12;
function onLoad() {
//初始化地图对象
map = new T.Map("mapDiv");
//设置显示地图的中心点和级别
map.centerAndZoom(new T.LngLat(116.40969, 38.89945), zoom);
var lo = new T.Geolocation();
fn = function (e) {
if (this.getStatus() == 0){
map.centerAndZoom(e.lnglat, 15)
alert("获取定位坐标："+e.lnglat.lat + "," + e.lnglat.lng)
var marker = new T.Marker(e.lnglat);
map.addOverLay(marker);
}
if(this.getStatus() == 1){
map.centerAndZoom(e.lnglat, e.level)
alert("获取定位坐标："+e.lnglat.lat + "," + e.lnglat.lng)
var marker = new T.Marker(e.lnglat);
map.addOverLay(marker);
}
}
lo.getCurrentPosition(fn);
}
</script>
</head>
<body onLoad="onLoad()">
<div id="mapDiv"></div>
<p>本示例演示如用H5定位所在城市</p>
</body>
</html>天地图h5定位
猜你喜欢
转载自blog.csdn.net/sunyanchun/article/details/128939035
今日推荐
周排行