W3C Geolocation API (HTML5)

I have fiddled a little bit with the W3C Geolocation API and made the below demo on how to detect the user’s location within a browser. The demo uses HTML5 and the Google Maps API V3, which is designed to load faster, especially on mobile browsers such as Android-based devices and the iPhone.

See demo in fullscreen here: W3C Geolocation API Demo – you can also see this demo on your iPhone.

Feel free to comment, if you have any experience on geolocation

As an alternative it is also posible to use the Google Gears Geolocation API, see code example here: Google Maps Javascript API V3 – Basics

Currently, several ways exist to detect the user’s location within a browser. None of these methods are part of the Google Maps API; instead, they are common industry standards.

  • Newer browsers are starting to support the W3C Geolocation standard. This standard is part of HTML5 and will likely become the de-facto standard going forward. All applications that wish to perform geolocation should support this standard.
  • Some browsers with Google Gears can use Google Gears Geolocation API. Since widespread support for the W3C standard is still forthcoming, checking for Gears is a good fallback mechanism.
  • Some browsers use IP addresses to detect a user’s location, though this provides only a very rough estimate.

Source: code.google.com

Additional Google Maps resources:

This entry was posted in Google, HTML5, iPhone, User Experience, Web Development. Bookmark the permalink.

4 Responses to W3C Geolocation API (HTML5)

  1. Mike Terry says:

    That’s pretty nice, thumbs up!

  2. hon says:

    Can I have a link to activate the geolocation instead of enable tracking automatically?

  3. That should not be a problem, I might even change this demo to reflect you idea. I can be quite annoying the browser for permission to geolocated.

    But take a look at the specification (http://dev.w3.org/geo/api/spec-source.html), you can use the one-shot method and make it a click action on your link.

Leave a Reply