Javascript:Check if browser supports HTML 5 Geolocation Object

7 Jan

Geolocation Object is one of the cool features of the HTML 5.It is definitely going to make life easier for companies or sites which are predominantly in B2C category who can now make more bucks compare to other domains as they can now chalk out unique location based strategy for their customers.In addition to these domains, Geolocation can also used for various other purposes like security/tracking the missing people etc. though other techniques of tracking devices like using GPS/Cell id etc. are also as effective as Geolocation.But I guess Geolocation technique used via browsers will be one of the most cheapest ways of implementing location based strategy provided users gives the consent for tracking their locations.

However I would like to highlight here that W3C standards for some reasons have suggested implementation of  this object with caveat that information obtained via geolocation might not be fully accurate enough.Though I agree this is fair enough suggestions given that depth and breadth of the pattern of its usage across various devices and situations.In layman terms, it cannot be used legally with additional data to substantiate the proof of the location.But again benefits outweighs the risks here and that’s the reason I feel its one of the best things that has ever happened to web in recent times.

While experimenting with Geolocation Object of HTML 5, I wrote the small piece of JS code which I believe can tell us whether the browser supports Geolocation object or not.

Below is the sample HTML Empty code which loads the checkgeo javascript and dynamically creates the p element and then writes the user agent information giving the message whether the user agent supports Geolocation object or not.

The function checkgeolocationobject is part of checkgeo.js file and it needs to be present in the JS file.You can also have this function in the script tag of the HTML page.

<!DOCTYPE HTML>
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />
<title>HTML Geolocation Check</title>
<style type=”text/css”>
p{
    font-family:Verdana;
    font-size:16;
    font-weight:bold;   
}
</style>
<script type =”text/javascript” src=”js/checkgeo.js”>
</script>
</head>

<body onload=”checkgeolocationobject()”>

</body>
</html>

The Javascript piece which checks geolocation objects is as below.

function checkgeolocationobject(){   
    if(window.navigator.geolocation){   
        var para = document.createElement(‘p’);
        var message = document.createTextNode(“Yes we support Geolocation fully for ” + navigator.userAgent);
        para.appendChild(message);
        document.body.appendChild(para);
        document.styleSheets[0].addRule(“p”, “color:blue”, 0);       
    }
    else {       
        var para = document.createElement(‘p’);
        var message = document.createTextNode(“No we do not support Geolocation fully for ” + navigator.userAgent);
        para.appendChild(message);
        document.body.appendChild(para);
        document.styleSheets[0].addRule(“p”, “color:red”, 0);       
    }   
}

 

Technorati Tags: ,
Advertisements

2 Responses to “Javascript:Check if browser supports HTML 5 Geolocation Object”

  1. Ankit Bhatia January 9, 2012 at 8:02 pm #

    Its good piece of code, its not working in IE8 for me

Leave a Reply

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

WordPress.com Logo

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

Google+ photo

You are commenting using your Google+ 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 )

Connecting to %s

%d bloggers like this: