w3c geolocation api - making websites location-aware
Post on 17-Oct-2014
32.843 views
DESCRIPTION
my slides from the Web 2.0 Expo session on the W3C Geolocation APITRANSCRIPT
W3C Geolocation APIMaking Websites Location-aware
Wednesday, April 1, 2009
me
• Director of Consumer Products at Skyhook Wireless
• Founded Locationaware.org which eventually became W3C Geolocation API Working Group
• Follow @rsarver to get the SlideShare link for slides after I post them
Wednesday, April 1, 2009
practical tools to allow you to add location capabilities to
your website today
Wednesday, April 1, 2009
What is Geolocation?
History of Geolocation on the web
Current State of the Union
Location Technologies
Code Examples
Questions
Wednesday, April 1, 2009
location = context
Wednesday, April 1, 2009
context = higher relevancy
Wednesday, April 1, 2009
location = higher relevancy
Wednesday, April 1, 2009
location comes in many flavors
Wednesday, April 1, 2009
37.78467, -122.40162
Wednesday, April 1, 2009
Wednesday, April 1, 2009
747 Howard St, San Francisco, CA
Wednesday, April 1, 2009
4th St & Howard St
Wednesday, April 1, 2009
Soma
Wednesday, April 1, 2009
Pete’s Coffee
Wednesday, April 1, 2009
Business Search APIs
• Yahoo Local Search API
• Yelp API
• Localeze - sells business listing information
• small businesses are tough, no db is totally complete
Wednesday, April 1, 2009
how you display it can be used as a way
of blurring location
Wednesday, April 1, 2009
Ryan checked into The Mission
Wednesday, April 1, 2009
map markers can be misleading when dealing
with user’s location
... maybe use text insteadWednesday, April 1, 2009
Wednesday, April 1, 2009
Wednesday, April 1, 2009
so, why should I use it?
Wednesday, April 1, 2009
Wednesday, April 1, 2009
HISTORYa lot has changed in a year
Wednesday, April 1, 2009
Wednesday, April 1, 2009
locationaware.org
Wednesday, April 1, 2009
Google Gears
Wednesday, April 1, 2009
W3C Geolocation API
Wednesday, April 1, 2009
coalition of the willing
Wednesday, April 1, 2009
state of the union
http://www.flickr.com/photos/xrrr/2478140383/Wednesday, April 1, 2009
2009 is the year of location in the
Browser
Wednesday, April 1, 2009
• Geode Extension in Mozilla Labs. Powered by Skyhook
• W3C Geolocation API support natively in 3.1 (now called 3.5)
• Opera Labs release with W3C Geolocation API support. Powered by Skyhook
• Support in Chrome for Windows and Android
Wednesday, April 1, 2009
http://bit.ly/mozilla-geode
http://bit.ly/opera-geolocation
http://google.com/chrome
Wednesday, April 1, 2009
Location Technologies
Wednesday, April 1, 2009
Two primary methods
1. IP Geolocation2.Triangulation
• GPS
• Wi-Fi
• Cell Tower
Wednesday, April 1, 2009
IP Geolocation• Widely available
• Detection happens server-side
Pros
• Only accurate to the city-level
• Only in the right state 85% of the time
• Costly
• Produces false positives
Cons
Wednesday, April 1, 2009
IP Geolocation
• MaxMind - http://www.maxmind.com
• Has a free database - GeoLite City
• Quova - http://www.quova.com
• IPligence - http://www.ipilgence.com
• IP2Location - http://www.ip2location.com
Vendors
Wednesday, April 1, 2009
10 m20 m
1000 m
GPSWi-Fi
Cell Tower
Triangulation
Wednesday, April 1, 2009
GPS• Accurate after it gets a fix
• Highly accurate in rural area
Pros
• Doesn’t work indoors
• Difficulty with Urban Canyons
• Long Time to First Fix
Cons
Wednesday, April 1, 2009
Wi-Fi Triangulation
Wednesday, April 1, 2009
Wi-Fi Positioning (WPS)• Accurate
• Works indoors and in Urban Areas
• Quick Time to First Fix
• Software-only, leverages existing Wi-Fi
Pros
• Doesn’t work well in rural areasCons
Wednesday, April 1, 2009
• Cross-platform, cross-browser plugin for adding geolocation to any website
• Locate a user down to their exact street address with a few lines of javascript
• http://loki.com/how
• </plug>
Wednesday, April 1, 2009
Cell Triangulation• Works where there is cell coverage (most
areas)
• Quick Time to First Fix
• Software-only, leverages existing cellular radio
Pros
• Very inaccurateCons
Wednesday, April 1, 2009
short answerhyrbid is the way
Wednesday, April 1, 2009
W3C Geolocation API
... shut up and get to the code
Wednesday, April 1, 2009
Single shot lookup
navigator.geolocation.getCurrentPosition(function(pos){
//show map at (pos.coords.latitude, pos.coords.longitude)
});
Wednesday, April 1, 2009
Position & Coordinates Objects
interface Position {
readonly attribute Coordinates coords;
readonly attribute DOMTimeStamp timestamp;
};
interface Coordinates {
readonly attribute double latitude;
readonly attribute double longitude;
readonly attribute double altitude;
readonly attribute double accuracy;
readonly attribute double altitudeAccuracy;
readonly attribute double heading;
readonly attribute double speed;
};
Wednesday, April 1, 2009
Single shot lookup w/ callbacks
function showMap(pos) {
//show map at pos.coords.latitude, pos.coords.longitude
}
function showError(err) {
alert(err.message + ‘, ’ + err.code);
}
navigator.geolocation.getCurrentPosition(showMap, showError);
Wednesday, April 1, 2009
PositionError Objectinterface PositionError {
const unsigned short UNKNOWN_ERROR = 0;
const unsigned short PERMISSION_DENIED = 1;
const unsigned short POSITION_UNAVAILABLE = 2;
const unsigned short TIMEOUT = 3;
readonly unsigned short code;
readonly DOMString message;
};
Wednesday, April 1, 2009
Single shot lookup w/ callbacks & options
function showMap(pos) {
//show map at pos.coords.latitude, pos.coords.longitude
}
function showError(err) {
alert(err.message + ‘, ’ + err.code);
}
navigator.geolocation.getCurrentPosition(showMap, showError,
{enableHighAccuracy:true});
Wednesday, April 1, 2009
PositionOptions
interface PositionOptions {
attribute boolean enableHighAccuracy;
attribute long timeout;
attribute long maximumAge;
};
Wednesday, April 1, 2009
Single shot lookup w/ cached position
function showMap(pos) {
//show map at pos.coords.latitude, pos.coords.longitude
}
function showError(err) {
alert(err.message + ‘, ’ + err.code);
}
navigator.geolocation.getCurrentPosition(showMap, showError,
{maximumAge:300000, timeout:0});
Wednesday, April 1, 2009
Periodic lookup w/ callbacks
function moveMap(pos) {
//update map to pos.coords.latitude, pos.coords.longitude
}
function showError(err) {
alert(err.message + ‘, ’ + err.code);
}
// Track location with periodic updates
watchId = navigator.geolocation.watchPosition(moveMap, showError);
function stopTracking() {
navigator.geolocation.clearWatch(watchId);
}
Wednesday, April 1, 2009
Upcoming Geo Events• Where 2.0
San Jose, CAMay 19th - 21st
• WhereCampSan Francisco, CAMay 23rd - 24th
Wednesday, April 1, 2009
Questions?tweet @rsarver with questions as well
Wednesday, April 1, 2009