網頁獲取用戶位置信息的辦法
1 調用百度地圖的地圖標注功能,通過百度地圖API獲取對應的經度和緯度進而獲取地區信息
優點是比較准確,缺點是需要用戶自己選擇位置
2 通過H5 geolocation屬性獲取經度和緯度,優點是用戶只需要點擊允許獲取即可,缺點是瀏覽器獲取的經度相對不是很准確而且仍舊需要用戶確認。
3 通過用戶IP來分析用戶位置(待后續研究)
下面是第二種方法的代碼實現
<!DOCTYPE html> <html> <head> <meta charset="utf-8"/> <title>基於瀏覽器的HTML5查找地理位置</title> <!-- 百度API --> <script src="http://api.map.baidu.com/api?v=1.2" type="text/javascript"></script> <script> function getLocation(){ var options={ enableHighAccuracy:true, maximumAge:1000 } if(navigator.geolocation){ //瀏覽器支持geolocation navigator.geolocation.getCurrentPosition(onSuccess,onError,options); }else{ //瀏覽器不支持geolocation alert('您的瀏覽器不支持地理位置定位'); } } //成功時 function onSuccess(position){ //返回用戶位置 //經度 var longitude =position.coords.longitude; //緯度 var latitude = position.coords.latitude; alert('經度'+longitude+',緯度'+latitude); //根據經緯度獲取地理位置,不太准確,獲取城市區域還是可以的 var map = new BMap.Map("allmap"); var point = new BMap.Point(longitude,latitude); var gc = new BMap.Geocoder(); gc.getLocation(point, function(rs){ var addComp = rs.addressComponents; alert(addComp.province + ", " + addComp.city + ", " + addComp.district + ", " + addComp.street + ", " + addComp.streetNumber); }); } //失敗時 function onError(error){ switch(error.code){ case 1: alert("位置服務被拒絕"); break; case 2: alert("暫時獲取不到位置信息"); break; case 3: alert("獲取信息超時"); break; case 4: alert("未知錯誤"); break; } } window.onload=getLocation; </script> </head> <body> </body> </html>