教育行業(yè)A股IPO第一股（股票代碼 003032）

全國咨詢/投訴熱線：400-618-4000

Geolocation API如何獲取用戶當前位置

更新時間:2022年03月31日15時34分 來源:傳智教育 瀏覽次數:

GeolocationAPI的使用非常簡單，“navigator.geolocation”對象提供了可以公開訪問地理位置的方法，其中navigator為瀏覽器內置對象。檢測瀏覽器是否支持定位API，只需要檢測geolocation是否存在于navigator中即可。對于移動Web開發(fā)者，大多數情況只需要獲取用戶的當前位置，此時我們可以使用getCurrentPosition()方法來獲取當前位置的坐標值。getCurrentPosition()被調用時會發(fā)起一個異步請求，瀏覽器會調用系統(tǒng)底層的硬件(如GPS)來更新當前的位置信息，當信息獲取到之后會在回調函數中傳入position對象。

position對象包含兩個屬性，一個是coords(坐標)，它是一個Coordiante對象，包含當前位置信息;另一個是timestamp，表示獲取到位置的時間戳。

coordiante對象包含包括經緯度在內的一系列信息具體如下所示。

latitude：一個十進制表示的緯度坐標。

longitude：一個十進制表示經度的坐標。

altitude：海拔高度(以米為單位，如果是5，表示精確到5米范圍)。

accuracy：當前經緯度信息的精度(以米為單位)。

altitudeAccuracy：當前海拔高度的精度。

heading：代表當前設備的朝向，該值是以弧度為單位，指示了按順時針方向相對

于正北的度數(例如：heading為270的時候表示正西方)。接下來，用通過一個案例來演示如何使GeolocationAPI獲取當前位置。代碼如demo3-6所示。

demo3-6.html

<!DOCTYPE html>
<html>
<head>
   <meta charset="UTF-8">
   <title>Title</title>
   <script>
         function getMyPosition(){
           if(window.navigator.geolocation){
               //獲取當前位置..
               alert("正在獲取您的位置.");
               //如果獲取位置成功，會調用名字為successPosition 的方法.
               navigator.geolocation.getCurrentPosition
               (successPosition,errorPosition);
            }else{
               alert("您當前的瀏覽器不支持..");
            }
       }
       function successPosition(position){
          var jd=position.coords.longitude;//經度
          var wd=position.coords.latitude;//緯度
          alert(jd+","+wd);
        }
        //如果沒有獲取到位置，就會調用這個方法
        function errorPosition(){
                alert("獲取位置失敗.");
        }
        getMyPosition();
    </script>
</head>
<body>
</body>
</html>

因為Geolocation獲取當前定位除了瀏覽器的支持，還需要硬件設備的支持，上述代碼在不支持該操作的設備上運行的結果如圖3-8和圖3-9。

普通PC提示對話框
圖3-8普通PC提示對話框1
普通PC提示對話框2
圖3-9普通PC提示對話框2

現在我們在Mac電腦上用瀏覽器打開demo3-6，結果如圖3-10和圖3-11所示。

Mac提示對話框
圖3-10Mac提示對話框1
Mac提示對話框
圖3-11Mac提示對話框2

在移動端用瀏覽器打開demo3-6，結果如圖3-12和圖3-13所示。

Geolocation API移動提示對話框
圖3-12移動提示對話框1

圖3-13移動提示對話框2

以上內容演示了Geolocation獲取當前位置的過程，值得一提的是，該案例獲取的是當前位置的地理坐標，所以位置變化會導致坐標變化。

多學一招：監(jiān)視移動設備的位置變化

接下來要介紹一個名詞LBS，LBS是基于位置的服務，它是通過電信移動運營商的無線電通訊網絡(如GSM網、CDMA網)或外部定位方式(如GPS)獲取移動終端用戶的位置信息(地理坐標，或大地坐標)。

在正文中演示的getCurrentPosition()方法只在調用時會得到位置信息，在LBS應用中，檢測用戶位置變化是非常常見的需求。一個做法是通過循環(huán)調用的方式去檢測位置變化。

例如，設置了一個10秒作為獲取位置的間隔，這樣做的缺點是：編程人員無法知道用戶當前的速度，如果在飛機高鐵上，10秒可能已經走了很長一段距離，這樣提供給用戶的位置信息可能是延遲的，如果將間隔設置的很短，又會非常耗電耗能，如果用戶長時間沒動，那這些查詢都是無用的。

為了解決這個問題，Geolocation還提供了watchPosition()方法，可以讓系統(tǒng)通知編程人員用戶的位置發(fā)生了變化。

watchPosition()方法和getCurrentPosition方法在調用上類似，但方法功能與getCurrentPosition的區(qū)別是非常明顯的。調用該函數時會返回一個watch ID，這個ID和setInterval()函數返回的ID類似，可以用于清除此次的監(jiān)視操作。

watchPosition()方法也接受相同的三個參數，success、error回調以及一個PositionOptions對象。





猜你喜歡：

HTTP模塊常用的API有幾個？

matplotlib是什么？matplotib的3中API介紹

Web API和API有什么關系？

API服務網關實現之APISIX安裝和部署

傳智教育前端與移動開發(fā)培訓課程

0 分享到：
和我們在線交談！