Open In App

HTML DOM Geolocation position Property

Improve
Improve
Like Article
Like
Save
Share
Report

The Geolocation position property in HTML DOM is used to return the position of a device on Earth. The returned Coordinates object could be used for various purposes including navigation and tracking the position of the device. 

Return Value:

  • position.coords: The coordinates object that has all the information of the current location.
  • position.timestamp: It represents the DOMTimeStamp which represents the time when the location is obtained.

Usage: Methods like getCurrentPosition() or watchPosition() are used to pass a callback to a function and then access the position property. 

Example: 

html




<!DOCTYPE html>
<html>
  
<title>
    DOM Geolocation position Property
</title>
  
<body>
    <h1 style = "color: green">
        GeeksforGeeks
    </h1>
      
    <b>
        DOM Geolocation position Property
    </b>
      
    <p>
        Click the button to get your position.
    </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) {
            x.innerHTML = "Latitude: " + 
              
            /* Get the latitude from the Coordinates object */
            position.coords.latitude + 
      
            "<br>Longitude: " + 
      
            /* Get the longitude from the Coordinates object */
            position.coords.longitude +
              
            "<br>Timestamp: " +
              
            /* Get the timestamp of the location obtained */
            position.timestamp;
        }
    </script>
</body>
  
</html>                    


Output: Before Click on the button:

 before-button 

After Click on the button:

 after-button 

Supported Browsers: The browser supported by DOM Geolocation position property are listed below:

  • Google Chrome 79.0 and above
  • Edge 79.0 and above
  • Internet Explorer 9.0
  • Firefox 72.0 and above 
  • Opera 16.0 and above
  • Safari 13.1 and above


Last Updated : 14 Jun, 2023
Like Article
Save Article
Previous
Next
Share your thoughts in the comments
Similar Reads