Evangelism/Firefox3.5/35Days/Articles/geolocationDemo: Difference between revisions

From MozillaWiki
Jump to navigation Jump to search
Line 1: Line 1:
== Geolocation API and free data providers ==
== Geolocation API and free data providers ==
Doug Turner, the man behind the Geolocation implementation in Firefox 3.5, has written a great article about this new mechanism (FIXME: link to the hacks.m.o Doug's article).
Here is a demo showing how you can enjoy this feature, only with free tools and free data.


[http://3liz.org/geolocation/ Geolocation API Demo with OpenLayers, OpenStreetMap and GeoNames]
[http://3liz.org/geolocation/ Geolocation API Demo with OpenLayers, OpenStreetMap and GeoNames]


The demo draws a map center on the position given by the navigator, it determines the map's precision by defining an accuracy extent, and load geo-information inside the accuracy.
The demo draws a map centered on the position given by the navigator.
''Don't forget to click "Share location".''
 
Ok, that's the basis of the Geolocation.
But there are several data available in the Internet you can use to make your user happier, and some, are free (as a speech).
 
You can see several information displayed around your location, like the names of cities, villages, lake, parks, ... all these information are from the GeoName service. If you click on the name, you'll see more information from Wikipedia. The map itself is free too (thanks OpenStreepMap).


The map is drawn with [http://openlayers.org OpenLayers], a JavaScript library to draw dynamic map inside web page. The base layer is provided by [http://openstreetmap.org OpenStreetMap] (OSM). OSM is a project to construct a free world map based on contribution. The geo-information inside the accuracy is provided by [http://geonames.org GeoNames], a free database of geolocalised places. GeoNames provides a way to query geolocalised wikipedia's articles.
The layer mechanism is powered by OpenLayers. A free Javascript library.


The main operation is to calculate an extent based on the position and its accuracy.
That's a kind of ''data mashup'' from free tools and free data.


function getAccuracyExtent(aLatitude, aLongitude, aAccuracy) {
If you want to know more:
  var R = 6371000; // Earth radius in meters
* link to MDC & Geolocation
  var lat1 = aLatitude*Math.PI/180;
* link to GeoName
  var lon1 = aLongitude*Math.PI/180;
* link to OpenStreetMap
  // Point at 45° North East
* link to OpenLayers
  var brng = 45*Math.PI/180;
  var lat2 = Math.asin( Math.sin(lat1)*Math.cos(aAccuracy/R) +
                        Math.cos(lat1)*Math.sin(aAccuracy/R)*Math.cos(brng) );
  var lon2 = lon1 +
              Math.atan2( Math.sin(brng)*Math.sin(aAccuracy/R)*Math.cos(lat1),
                          Math.cos(aAccuracy/R)-Math.sin(lat1)*Math.sin(lat2));
  lon2 = (lon2+Math.PI)%(2*Math.PI) - Math.PI;
  lat2 =lat2*180/Math.PI;
  lon2 =lon2*180/Math.PI;
  // Point at 45° South West
  var brng = 225*Math.PI/180;
  var lat3 = Math.asin( Math.sin(lat1)*Math.cos(aAccuracy/R) +
                        Math.cos(lat1)*Math.sin(aAccuracy/R)*Math.cos(brng) );
  var lon3 = lon1 +
              Math.atan2( Math.sin(brng)*Math.sin(aAccuracy/R)*Math.cos(lat1),
                          Math.cos(aAccuracy/R)-Math.sin(lat1)*Math.sin(lat3));
  lon3 = (lon3+Math.PI)%(2*Math.PI) - Math.PI;
  lat3 =lat3*180/Math.PI;
  lon3 =lon3*180/Math.PI;
  // return the extent
  return {north:lat2,south:lat3,east:lon2,west:lon3};
}


When we have this extent, the map is zoom to extent (center to the position with a precision reflecting the accuracy) and we query GeoNames to know geolocalised wikipedia's article and places inside the accuracy extent. If the accuracy is less than 1000 meters, we used to query GeoNames an accuracy extent based on an accuracy of 1000 meters.
(FIXME: screenshot)

Revision as of 15:37, 8 June 2009

Geolocation API and free data providers

Doug Turner, the man behind the Geolocation implementation in Firefox 3.5, has written a great article about this new mechanism (FIXME: link to the hacks.m.o Doug's article).

Here is a demo showing how you can enjoy this feature, only with free tools and free data.

Geolocation API Demo with OpenLayers, OpenStreetMap and GeoNames

The demo draws a map centered on the position given by the navigator. Don't forget to click "Share location".

Ok, that's the basis of the Geolocation. But there are several data available in the Internet you can use to make your user happier, and some, are free (as a speech).

You can see several information displayed around your location, like the names of cities, villages, lake, parks, ... all these information are from the GeoName service. If you click on the name, you'll see more information from Wikipedia. The map itself is free too (thanks OpenStreepMap).

The layer mechanism is powered by OpenLayers. A free Javascript library.

That's a kind of data mashup from free tools and free data.

If you want to know more:

  • link to MDC & Geolocation
  • link to GeoName
  • link to OpenStreetMap
  • link to OpenLayers

(FIXME: screenshot)

Retrieved from "https://wiki.allizom.org/index.php?title=Evangelism/Firefox3.5/35Days/Articles/geolocationDemo&oldid=147718"