日韩性视频-久久久蜜桃-www中文字幕-在线中文字幕av-亚洲欧美一区二区三区四区-撸久久-香蕉视频一区-久久无码精品丰满人妻-国产高潮av-激情福利社-日韩av网址大全-国产精品久久999-日本五十路在线-性欧美在线-久久99精品波多结衣一区-男女午夜免费视频-黑人极品ⅴideos精品欧美棵-人人妻人人澡人人爽精品欧美一区-日韩一区在线看-欧美a级在线免费观看

歡迎訪問 生活随笔!

生活随笔

當前位置: 首頁 > 前端技术 > HTML >内容正文

HTML

根据HTML5 获取当前位置的经纬度【百度地图】【高德地图】

發布時間:2023/12/13 HTML 39 豆豆
生活随笔 收集整理的這篇文章主要介紹了 根据HTML5 获取当前位置的经纬度【百度地图】【高德地图】 小編覺得挺不錯的,現在分享給大家,幫大家做個參考.

是想讓地圖的定位用戶位置更準確一些。

查看了介紹:?http://www.w3school.com.cn/html5/html_5_geolocation.asp

看介紹中拿數據挺簡單。

?

<!DOCTYPE html> <html> <body> <p id="demo">點擊這個按鈕,獲得您的坐標:</p> <button onclick="getLocation()">試一下</button> <script> var x=document.getElementById("demo"); function getLocation(){if (navigator.geolocation){navigator.geolocation.getCurrentPosition(showPosition);}else{x.innerHTML="Geolocation is not supported by this browser.";}} function showPosition(position){x.innerHTML="Latitude: " + position.coords.latitude + "<br />Longitude: " + position.coords.longitude; }</script> </body> </html>

?

正確點擊按鈕能拿到返回的經緯度

有個問題是: ? ?navigator.geolocation.getCurrentPosition(showPosition); ? 這個回調,有時有,有時沒有 ,不穩定。 ?還有就是出來的經緯度弄到地圖上,我了個去,跑到廣州了。。。

?

--------------------------------------

本身百度地圖api?

ip定位: ??http://lbsyun.baidu.com/jsdemo.htm#i8_2 , ?有點糙,顯示的是城市名

瀏覽器定位: ?http://lbsyun.baidu.com/jsdemo.htm#i8_1 ? ,拿到經緯度展示,大概的。

?

百度有個?Geolocation, 打開上面的2個中一個,替換下<script>代碼如下,執行下

<script type="text/javascript">// 百度地圖API功能var map = new BMap.Map("allmap");var point = new BMap.Point(116.331398,39.897445);map.centerAndZoom(point,12);var geolocation = new BMap.Geolocation(); //實例化瀏覽器定位對象。//下面是getCurrentPosition方法。調用該對象的getCurrentPosition(),與HTML5不同的是,這個方法原型是getCurrentPosition(callback:function[, options: PositionOptions]),也就是說無論成功與否都執行回調函數1,第二個參數是關于位置的選項。 因此能否定位成功需要在回調函數1中自己判斷。 geolocation.getCurrentPosition(function(r){ //定位結果對象會傳遞給r變量if(this.getStatus() == BMAP_STATUS_SUCCESS){ //通過Geolocation類的getStatus()可以判斷是否成功定位。var mk = new BMap.Marker(r.point); //基于定位的這個點的點位創建markermap.addOverlay(mk); //將marker作為覆蓋物添加到map地圖上map.panTo(r.point); //將地圖中心點移動到定位的這個點位置。注意是r.point而不是r對象。alert('您的位置:'+r.point.lng+','+r.point.lat); //r對象的point屬性也是一個對象,這個對象的lng屬性表示經度,lat屬性表示緯度。}else {alert('failed'+this.getStatus());} },{enableHighAccuracy: true}) </script>

  

得到的是大致的經緯度,但城市是對的,位置有些偏差。

?-----------------------------

?

這個功能上,高德地圖api更好一些 ,誤差很小。

自定義定位圖標:?http://lbs.amap.com/api/javascript-api/example/location/custom-location-icon

?

瀏覽器定位:http://lbs.amap.com/api/javascript-api/example/location/browser-location

/*************************************** 由于Chrome、IOS10等已不再支持非安全域的瀏覽器定位請求,為保證定位成功率和精度,請盡快升級您的站點到HTTPS。 ***************************************/

?

?

很準的說, 需要升級 https

轉載于:https://www.cnblogs.com/jshare/p/7066154.html

總結

以上是生活随笔為你收集整理的根据HTML5 获取当前位置的经纬度【百度地图】【高德地图】的全部內容,希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯,歡迎將生活随笔推薦給好友。