Slide 3.15: HTML5 videos
Slide 4.1: Programming Exercise II: A static bookstore using CSS
Home

HTML5 Geolocation

Geolocation is a feature of the HTML5 specification and API. Geolocation can pinpoint the user’s location anywhere in the world. Since this can compromise user privacy, the position is not available unless the user approves it. Geolocation adds location based features that are ECMAScript compliant (Javascript).

Geolocation uses the Location Information Server (LIS) to locate and track information on a user which was set up by the National Emergency Number Association.

Other sources of information may include GPS, if available, RFID, the device’s IP address, Wi-Fi identification. The API operates on a “best-effort” but does not guarantee the exact location precision. The example below is a simple Geolocation example returning the latitude and longitude of the user’s position:   

<!DOCTYPE HTML>
<html>
 <body>
  Click the button to get your coordinates:  
  <button onClick="getLocation( )">Get the Position!</button>
  <p id="demo"></p>

  <script>
   var  x = document.getElementById( "demo" );

   function  getLocation( ) {
    if ( navigator.geolocation ) 
     navigator.geolocation.getCurrentPosition( showPosition );
    else
     x.innerHTML = "Geolocation is not supported by this browser.";
   }

   function  showPosition( position ) {
    x.innerHTML  = "Latitude: "  + position.coords.latitude; 
    x.innerHTML += "Longitude: " + position.coords.longitude;
   }
  </script>
 </body>
</html>


Demonstration
The following example draws a direction by using Google Maps:     () 




 

   Start: 
   
         End: