定位用户的位置
HTML5 Geolocation API 用于获得用户的地理位置。
鉴于该特性可能侵犯用户的隐私，除非用户同意，否则用户位置信息是不可用的。
用法如下：
<!DOCTYPE html>
<html>
<body>
<p id="demo">点击这个按钮，获得您的位置：</p>
<button onclick="getLocation()">试一下</button>
<div id="mapholder"></div>
<script src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script>
var x=document.getElementById("demo")
function getLocation()
{
if (navigator.geolocation)
{
navigator.geolocation.getCurrentPosition(showPosition,showError)
}
else{x.innerHTML="Geolocation is not supported by this browser."}
}
function showPosition(position)
{
lat=position.coords.latitude
lon=position.coords.longitude
latlon=new google.maps.LatLng(lat, lon)
mapholder=document.getElementById('mapholder')
mapholder.style.height='250px'
mapholder.style.width='500px'
var myOptions={
center:latlon,zoom:14,
mapTypeId:google.maps.MapTypeId.ROADMAP,
mapTypeControl:false,
navigationControlOptions:{style:google.maps.NavigationControlStyle.SMALL}
}
var map=new google.maps.Map(document.getElementById("mapholder"),myOptions)
var marker=new google.maps.Marker({position:latlon,map:map,title:"You are here!"})
}
function showError(error)
{
switch(error.code)
{
case error.PERMISSION_DENIED:
x.innerHTML="User denied the request for Geolocation."
break
case error.POSITION_UNAVAILABLE:
x.innerHTML="Location information is unavailable."
break
case error.TIMEOUT:
x.innerHTML="The request to get user location timed out."
break
case error.UNKNOWN_ERROR:
x.innerHTML="An unknown error occurred."
break
}
}
</script>
</body>
</html>
我可以很负责人的告诉你，Geolocation接口不仅在PC上可以，在手机上更没有任何兼容问题，在所有手机浏览器上已经实现，只要手机有GPS模块，Geolocation就能用。
Geolocation接口只有一个问题，就是在调用时，会d出一个对话框，需要用户确认权限，才能使用，否则会调用失败。
下图可以看到，Geolocation接口被支持的非常好。
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）