Home > DeveloperSection > Articles > getCurrentPosition method in HTML5

getCurrentPosition method in HTML5

Posted by  Awadhendra Tiwari
on    July-30-2011 20:12 PM

JQuery JQuery 
Ratings:
0 Comment(s)
 8770  View(s)
Rate this:

getCurrentPosition method in HTML5

Gelocation is the identification of the real world geographic location of an internet-connected computer, mobile device, website visitor or other. IP address geolocation data can include information such as country, region, and city, postal/zip code, latitude, longitude and time zone..... Today most of the browsers and mobile devices support Geolocation API. The geolocation APIs work with a new property of the global navigator object i.e. Geolocation object which can be created as follows:

var location = navigator.geolocation;

Gelocation method:

·         getCurrentPosition()

·         watchposition()

·         clearWatch()

The getCurrentPosition method retrieves the current geographic location of the user. The location information is returned in a position object. In this article I am trying to show you that how we can find out the user geographic location.

Code:

<script type="text/javascript">

        function Location(position)//location function is defining with parameter

         {

            var latitude = position.coords.latitude; //Specifies the longitude estimate in decimal degrees. The value range is [-180.00, +180.00].

            var longitude = position.coords.longitude;

            document.getElementById("lati").innerHTML = latitude; //latitude value is defining in label element where id is lati

            document.getElementById("longi").innerHTML = longitude;

        }

        function findLocation()

        {

            if (navigator.geolocation)//checking browser compatibility

             {

                navigator.geolocation.getCurrentPosition(Location);//getCurrentPosition method retrieve the current geographic location of the user 

            }

        }

    </script>

</head>

<html>

<body>

    Latitude:<label id="lati"></label><br /><br />

    Longitude:<label id="longi"></label><br /><br />

    <input type="submit" onclick="findLocation();" value="Find Location" />

</body>

When button is clicked latitude and longituudeof the user  will show on page as shown below:

getCurrentPosition method in HTML5
















Recent Activities


Barbara Jones added new Question What is ANR?   3 days ago

Kamlakar Singh added new Blog Convert Text Document to PDF File   17 days ago

Kamlakar Singh added new Article Introduction to Backbone.js   17 days ago

Don't want to miss updates? Please click the below button!