Using the GeoLocation API

Warning This article was written over six months ago, and may contain outdated information.

With the rapid growth of the mobile web, loca¬≠tion-aware ser¬≠vices are very much in-demand; the GeoLo¬≠ca¬≠tion API was pro¬≠posed to cater to this need.

Imple­men­ta­tion is spot­ty at the moment; Fire­fox 3.5 sup­ports it, as does Safari for iPhone (although not on the desk­top, AFAICS). But it’s so sim­ple to use, I’ve no doubt it will be adopt­ed rapidly.

I’ve put togeth­er a small demo of the GeoLo­ca­tion API in action; it uses data from the Arts Coun­cil Eng­land web­site, so vis­i­tors from out­side of Eng­land won’t get any mean­ing­ful results from this, I’m afraid. Vis­i­tors from Eng­land will prob­a­bly get best results using a mobile device (such as an iPhone).

First, the JavaScript func¬≠tion tests that the brows¬≠er sup¬≠ports the API:

var hasGeoLocation = navigator.geolocation ? true : false;
if (hasGeoLocation === true) { ... }

If so, it requests the cur­rent posi­tion from the brows­er using the getCurrentPosition method (the user will have to give per­mis­sion for this) and pass­es the result into a function:

navigator.geolocation.getCurrentPosition(function(position) {
    getJSON(position.coords.latitude,position.coords.longitude);
});

This result is used in the lat¬≠i¬≠tude and lon¬≠gi¬≠tude attrib¬≠ut¬≠es of the coords object, which I then use for the rest of my func¬≠tion (using jQuery‚Äôs getJ¬≠SON func¬≠tion to mine micro¬≠for¬≠mat¬≠ted data from the map page of the Arts Coun¬≠cil Eng¬≠land web¬≠site, trans¬≠form¬≠ing it using Opti¬≠mus, then pars¬≠ing it back into HTML for my demo).

There’s a lot more to this, of course; the API is quite exten­sive, cov­er­ing alti­tude and head­ing as well as lat/long, and there’s a mas­sive amount of geo­t­agged data avail­able (Flickr pho­tos, for exam­ple). Hope­ful­ly my demo serves as an exam­ple of how easy it is to make the move into the mobile space.

1 comment on
“Using the GeoLocation API”

  1. Thanks! There is an arti­cle high­lights the capa­bil­i­ties and con­straints of this new JavaScript API which is based on wire­less geolo­ca­tion and com­pare it with the serv­er-side IP geolo­ca­tion at http://www.broken-links.com/2009/11/11/using-the-geolocation-api/ .