Determine User Location by using HTML5

Hello Friends,

You can determine user location by using HTML5 and Google Map easily. For that, you have to crate a HTML5 file by using your favorite compiler. I am using dreamweaver CS5.

The basic code of HTML5 are-

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Untitled Document</title>

After than, you have to write down the below code into body tag.

<input type="button" value="get location" onclick="getUserLocation()"/>
<div id="locationData">
 Location data here

Now, in the head tag, you have to write down the functions below-

function getUserLocation() {
 if (navigator.geolocation)
 navigator.geolocation.getCurrentPosition(displayLocation, displayError);
 document.getElementById("locationData").innerHTML = "Sorry - your browser doesn't support geolocation!";
function displayLocation(position) {
 var displayText = "User latitude is " + position.coords.latitude + " and longitude is " + position.coords.longitude; document.getElementById("locationData").innerHTML = displayText;
function displayError(error) {
var locationElement = document.getElementById("locationData");
 switch(error.code) {
 locationElement.innerHTML = "Permission was denied";

 locationElement.innerHTML = "Location data not available";

 case error.TIMEOUT:
 locationElement.innerHTML = "Location request timeout";

 case error.UNKNOWN_ERROR:
 locationElement.innerHTML = "An unspecified error occurred";

 locationElement.innerHTML = "Who knows what happened...";

Now, save this file with your Desiree name with the extension and run this.

After running this file, you will get a button into your body. When you will click into this button, then you will get the User latitude and longitude  .

Now, you can find out this user easily in google map by using this latitude and longitude in various web services.

Thanks for reading.


Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s