HTML Geolocation coordinates用法及代碼示例

HTML中的DOM地理位置坐標屬性用於返回設備在地球上的位置和高度。返回的Coordinates對象可以用於各種目的，包括導航和跟蹤設備的位置。

屬性值：

值	描述
coordinates.latitude	這是設備緯度(以十進製為單位)。
coordinates.longitude	這是設備經度(以十進製為單位)。
coordinates.accuracy	這是以米為單位返回的緯度和經度的精度。
coordinates.altitude	這是相對於海平麵的設備高度(以米為單位)。
coordinates.altitudeAccuracy	這是返回的海拔高度的精度(以米為單位)。
coordinates.heading	這是設備運行的方向。該值以度為單位，表示相對於真北的當前方向。該值可以為空。
coordinates.speed	這是設備的速度，單位為米/秒。如果設備未運行，則該值可以為null。

用法：getCurrentPosition()或watchPosition()之類的方法用於將回調傳遞給函數，然後訪問坐標屬性。

例：

<!DOCTYPE html> 
<html> 
<title>DOM Geolocation coordinates Property</title> 
  
<body>   
  <h1 style="color:green">GeeksforGeeks</h1> 
    
  <b>DOM Geolocation coordinates Property</b> 
    
  <p>Click the button to get your coordinates.</p> 
      
  <button onclick="getLocation()">Get Location</button> 
    
  <p class="location"></p> 
  
    <script> 
        let x = document.querySelector('.location'); 
  
        function getLocation() { 
  
            /* Check if location support is available */ 
            if (navigator.geolocation) { 
  
                /* Callback to the showPosition function */ 
                navigator.geolocation.getCurrentPosition( 
                  showPosition); 
            } else { 
                x.innerHTML = "Geolocation is not supported."; 
            } 
        } 
  
        function showPosition(position) { 
  
            /* Assign the Coordinates object to a variable */ 
            let coordinatesObject = position.coords; 
  
            x.innerHTML = 
                "Accuracy:" + 
  
                /* Get the accuracy from the  
                Coordinates object */ 
                coordinatesObject.accuracy + 
  
                "<br>Latitude:" + 
  
                /* Get the latitude from the  
                Coordinates object */ 
                coordinatesObject.latitude + 
  
                "<br>Longitude:" + 
  
                /* Get the longitude from the  
                Coordinates object */ 
                coordinatesObject.longitude + 
  
                "<br>Altitude:" + 
  
                /* Get the altitude from the  
                Coordinates object */ 
                coordinatesObject.altitude + 
  
                "<br>Altitude Accuracy:" + 
  
                /* Get the altitude accuracy  
                from the Coordinates object */ 
                coordinatesObject.altitudeAccuracy + 
  
                "<br>Speed:" + 
  
                /* Get the speed from  
                the Coordinates object */ 
                coordinatesObject.speed + 
  
                "<br>Heading:" + 
  
                /* Get the heading from  
                the Coordinates object */ 
                coordinatesObject.heading; 
  
        } 
    </script> 
</body> 
  
</html>

輸出：

在單擊按鈕之前：
coords-before

單擊按鈕後：
coords-after

支持的瀏覽器：DOM地理位置坐標屬性支持的瀏覽器如下：

穀歌瀏覽器5.0
Firefox 3.5
Internet Explorer 9.0
Opera 10.6
Safari 5.0

相關用法

注：本文由純淨天空篩選整理自sayantanm19大神的英文原創作品 HTML | DOM Geolocation coordinates Property。非經特殊聲明，原始代碼版權歸原作者所有，本譯文未經允許或授權，請勿轉載或複製。