JavaScript中Geolocation怎么使用

這篇文章主要介紹“JavaScript中Geolocation怎么使用”，在日常操作中，相信很多人在JavaScript中Geolocation怎么使用問題上存在疑惑，小編查閱了各式資料，整理出簡單好用的操作方法，希望對大家解答”JavaScript中Geolocation怎么使用”的疑惑有所幫助！接下來，請跟著小編一起來學習吧！

如需在地圖中顯示結果，您需要訪問地圖服務，例如 Google 地圖。

在下面的例子中，返回的緯度和經度用于在 Google 地圖中顯示位置（使用靜態圖像）：

實例

function showPosition(position) {

  let latlon = position.coords.latitude + "," + position.coords.longitude;

  let img_url = "https://maps.googleapis.com/maps/api/staticmap?center=

  "+latlon+"&zoom=14&size=400x300&sensor=false&key=YOUR_KEY";

  document.getElementById("mapholder").innerHTML = "<img src='"+img_url+"'>";

}

Location-specific 信息

此頁面演示了如何在地圖上顯示用戶的位置。

Geolocation 對于特定于位置的信息也非常有用，例如：

最新的本地信息

顯示用戶附近的興趣點

逐向導航（Turn-by-turn navigation）(GPS)

getCurrentPosition() 方法 - 返回數據

getCurrentPosition() 方法在成功時返回一個對象。會始終返回緯度、經度和精度屬性。如果可用，則返回其他屬性：

屬性 返回

coords.latitude 以十進制數表示的緯度（始終返回）。

coords.longitude 以十進制數表示的經度（始終返回）。

coords.accuracy 位置精度（始終返回）。

coords.altitude 平均海平面以上的高度（以米計）（如果可用則返回）。

coords.altitudeAccuracy 位置的高度精度（如果可用則返回）。

coords.heading 從北順時針方向的航向（如果可用則返回）。

coords.speed 以米/秒計的速度（如果可用則返回）。

timestamp 響應的日期/時間（如果可用則返回）。

Geolocation 對象 - 其他有趣的方法

Geolocation 對象還有其他有趣的方法：

watchPosition() - 返回用戶的當前位置，并隨著用戶移動（如汽車中的 GPS）繼續返回更新的位置。

clearWatch() - 停止 watchPosition () 方法。

下面的例子展示了 watchPosition() 方法。你需要準確的 GPS 設備來測試（比如智能手機）：

實例

<script>

const x = document.getElementById("demo");

function getLocation() {

  if (navigator.geolocation) {

    navigator.geolocation.watchPosition(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>

到此，關于“JavaScript中Geolocation怎么使用”的學習就結束了，希望能夠解決大家的疑惑。理論與實踐的搭配能更好的幫助大家學習，快去試試吧！若想繼續學習更多相關知識，請繼續關注億速云網站，小編會繼續努力為大家帶來更多實用的文章！