Location Detection

This is a PHP, HTML5 & JavaScript example of how your site can be location aware!.

Download the code!

What could your site do with visitor location data?

Precise address House number Street Point of interest Named location City District State Postcode Country Latitude Longitude Accuracy Altitude Altitude accuracy Directional heading Speed

Step by step guide to geolocation enabling your site:

Location detection with HTML5 is pretty simple. Browsers either support navigator.geolocation or they don't. If they do you can open up a whole world of local information to your users plus log a deeper and more geographic level of statistics server side.

JavaScript: Find out if navigator.geolocation is supported by the browser
JavaScript: If yes use the geolocation API to get the latitude and longitude values
JavaScript: Send latitude and longitude values to a server side script for processing
PHP: Query the Google Maps API to reverse geocode the latitude and longitude
PHP: Parse the resulting XML location data from the Google Maps API
PHP: Use these values to find local information to show your visitors. Could be from a database or remote API.
JavaScript: Update the page with data output by the server side script to offer your visitors local content!

Download samples for free to add geolocation enable your website.

How does this voodoo work? Words from the wise at W3:

Common sources of location information include Global Positioning System (GPS) and location inferred from network signals such as IP address, RFID, WiFi and Bluetooth MAC addresses, and GSM/CDMA cell IDs, as well as user input.

Geolocation Links:

W3 Geo Spec Mozilla Geo Guide Safari Geo Guide Google Geocoding

Follow @detectlocation on Twitter for updates

If you'd like to be kept up to date with the latest developments with the code please follow @detectlocation on Twitter. If you'd like to discuss the code, request extra features or just chime in with your two cents then join in on our thread at mobility.mobi