vue 使用高德開放平台獲取經緯度

 // 高德 獲取經緯度信息
    getLocation () {
      const _this = this
      const AMap = window.AMap
      AMap.plugin('AMap.Geolocation', function () {
        var geolocation = new AMap.Geolocation({
          // 是否使用高精度定位，默認：true
          enableHighAccuracy: true,
          // 設置定位超時時間，默認：無窮大
          timeout: 10000
        })

        geolocation.getCurrentPosition()
        AMap.event.addListener(geolocation, 'complete', onComplete)
        AMap.event.addListener(geolocation, 'error', onError)

        function onComplete (data) {
          console.log('定位成功緯度信息：', data.position.lat)
          console.log('定位成功經度信息：', data.position.lng)
          _this.latitude = data.position.lat
          _this.longitude = data.position.lng
          _this.getmarketposition()
        }
        function onError (data) {
          // console.log('定位失敗錯誤：', data)
          _this.getmarketposition()
        }
      })
    }

 

 // h5原生 獲取經緯度信息

navigator.geolocation的三個方法：

1. getCurrentPosition()

2. watchPosition()

3. clearWatch()

getCurrentPosition()

使用方法：navigator.geolocation.getCurrentPosition(successCallback, [errorCallback] , [positionOptions]);

A) successCallback 獲取定位成功時執行的回調函數 eg: function(position){alert("緯度："+position.coords.latitude+"；經度："+position.coords.longitude)};

successCallback返回一個地理數據對象position作為參數，該對象有屬性timestamp和coords。timestamp表示該地理數據創建時間（時間戳）；coords包括另外七個屬性：

　　1. coords.latitude：估計緯度
　　2. coords.longitude：估計經度
　　3. coords.altitude：估計高度
　　4. coords.accuracy：所提供的以米為單位的經度和緯度估計的精確度
　　5. coords.altitudeAccuracy：所提供的以米為單位的高度估計的精確度
　　6. coords.heading： 宿主設備當前移動的角度方向，相對於正北方向順時針計算
　　7. coords.speed：以米每秒為單位的設備的當前對地速度

PS：firefox下還有address屬性，可以獲取詳細地址，不過我得到的地址是錯誤的，使用方法：position.address.city，具體如下：

address屬性
B) errorCallback 定位失敗時執行的回調函數 eg: function(error){alert(error.message);}

errorCallback返回一個錯誤數據對象error作為參數，該對象有屬性：

　　1.code :表示失敗原因，返回1 or 2 or 3 ，具體為

　　　　PERMISSION_DENIED (數值為1) 表示沒有權限使用地理定位API

　　　　POSITION_UNAVAILABLE (數值為2) 表示無法確定設備的位置，例如一個或多個的用於定位采集程序報告了一個內部錯誤導致了全部過程的失敗

　　　　TIMEOUT (數值為3) 表示超時

　　　　詳情查看 http://dev.w3.org/geo/api/spec-source.html#permission_denied_error

　　2.message :錯誤提示內容 

C) positionOptions 用來設置positionOptions來更精細的執行定位，positionOptions擁有三個屬性{enableHighAccuracy:boolean , timeout:long , maximumAge:long}。

enableHighAccuracy 【true or false(默認)】是否返回更詳細更准確的結構，默認為false不啟用，選擇true則啟用，但是會導致較長的響應時間及增加功耗，這種情況更多的用在移動設備上。

timeout 設備位置獲取操作的超時時間設定（不包括獲取用戶權限時間），單位為毫秒，如果在設定的timeout時間內未能獲取位置定位，則會執行errorCallback()返回code（3）。如果未設定timeout，那么timeout默認為無窮大，如果timeout為負數，則默認timeout為0。

maximumAge 設定位置緩存時間，以毫秒為單位，如果不設置該值，該值默認為0，如果設定負數，則默認為0。該值為0時，位置定位時會重新獲取一個新的位置對象；該值大於0時，即從上一次獲取位置時開始，緩存位置對象，如果再次獲取位置時間不超過maximumAge，則返回緩存中的位置，如果超出maximumAge，則重新獲取一個新的位置。

 

原生h5經緯度不是很高，推薦使用高德

有人說也准

https://www.jianshu.com/p/03440a413903

 

// h5 獲取經緯度 在百度地圖使用時  需注意的地方

html5原生的定位API獲取到的地理位置，是未經加密的。

因此，為了保證html5原生的定位API獲取到的地理位置在百度地圖上較為准確的解析，就需要用官方提供的轉換類。

由於國內地圖產品的地理位置普遍進行了GCJ-02加密

因此，在用一種地圖產品的API時，都應養成一個習慣，就是看看它們有沒有提供地理位置信息轉換的類。

所以，用geolocation獲取的經緯度直接用誤差會很大，要進行轉換，百度地圖提供了這個方法 ，Convertor（）。

代碼詳見下面

參考
https://blog.csdn.net/qq_34437587/article/details/74936050

 

 

注：

1、百度 及 騰訊位置，均與此類似

2、切記 更改this指向問題

3、h5自帶 navigaor.geolocation  會有經度不是很准確的問題

 

參考

https://blog.csdn.net/weixin_46533797/article/details/105854263

https://www.cnblogs.com/lecaf/archive/2011/08/01/2123593.html

https://www.cnblogs.com/jshare/p/7066154.html