• Share
  • Email
  • Embed
  • Like
  • Save
  • Private Content
HTML 5 Geolocation
 

HTML 5 Geolocation

on

  • 2,460 views

An introduction to HTML5 Geolocation support as well as a general overview of Geolocation and Mobile Application Development implications

An introduction to HTML5 Geolocation support as well as a general overview of Geolocation and Mobile Application Development implications

Statistics

Views

Total Views
2,460
Views on SlideShare
2,449
Embed Views
11

Actions

Likes
1
Downloads
37
Comments
0

2 Embeds 11

http://localhost.webservices_cartographer 9
http://www.linkedin.com 2

Accessibility

Categories

Upload Details

Uploaded via as Microsoft PowerPoint

Usage Rights

CC Attribution-ShareAlike LicenseCC Attribution-ShareAlike License

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

    HTML 5 Geolocation HTML 5 Geolocation Presentation Transcript

    • HTML5 Geolocation
      Scott Ryan March 2011
      HTML5 Meetup Group
    • Agenda
      Geo-location Basics
      Privacy
      Error Handling
      Positioning
      Fall-Back
      Mapping
    • Basics
    • Geo-location Basics
      Five Methods
      Cell Tower Triangulation or Trilateration
      1 – X Towers Used (Accuracy Varies) ~3000m
      Quick Startup and lower power consumption
      No sky view required
      GPS
      4 - X Satellites Used of 24 available
      Slower startup and higher battery consumption
      Sky view required
      Better Accuracy ~3m
      Elevation Possible
    • Basics
      Wi fi Triangulation
      Requires Wi fi Access
      Higher Battery Consumption
      IP Lookup
      Requires IP Access
      Can be very inaccurate
      A-GPS
      Combination of GPS and Land Based System
      Altitude Accuracy
    • Cell Tower Techniques
      CID – Cell tower Id
      AOA – Angle of Arrival
      TOA – Time of Arrival
      TDOA – Time Difference of Arrival
      RSS – Received Signal Strength
      Multi path Fingerprint
      OTDOA – Observed Time Difference of Arrival
      U-TDOA – Uplink Time Difference Of Arrival
    • Example
      Google Maps
      3 circles
      Outside Circle (One tower)
      Inside Circle (multiple tower)
      Push Pin GPS
    • Google Maps
    • Privacy
    • Privacy
      Prompt for every domain
      Cannot bypass via code
      Non modal and tab specific
      Display requesting website with help
      Allow, Don’t Allow and Remember
      Errors are handled in the error callback
    • Sample Output
    • Error Handling
    • Error Handling
      Handled in Error Callback
      Code
      PERMISSION_DENIED (1)
      POSITION_UNAVAILABLE (2)
      TIMEOUT (3)
      UNKNOWN_ERROR (0)
      Message
    • Demo
    • Get Position
      getCurrentPosition(function, error_function,options)
      Latitude, longitude, altitude (optional)
      Accuracy
      Altitude Accuracy(optional)
      Heading (optional)
      Speed (optional)
      timestamp
    • Options
      Javascript object
      enableHighAccuracy
      Can fail on some phones due to permission
      Timeout (After permission is handled)
      maximumAge (caching)
    • Sample Code
      function get_position() {
      vars = document.querySelector('#status');
      s.innerHTML= "Checking for your location";
      if (Modernizr.geolocation) {
      navigator.geolocation.getCurrentPosition(success_callback,error_callback);
      } else {
      alert("No Geo-location Support. Falling back to Gears");
      }
      }
    • Sample Code
      function error_callback(positionError) {
      alert("Error" + positionError.code + " Message "
      + positionError.message);
      }
    • Sample Code
      function success_callback(position) {
      varlatitude = position.coords.latitude;
      varlongitude = position.coords.longitude;
      varelevation = position.coords.altitude;
      varaccuracy = position.coords.accuracy;
      varaltitudeAccuracy = position.coords.altitudeAccuracy;
      varheading = position.coords.heading;
      varspeed = position.coords.speed;
      vartimestamp = position.timestamp;
      }
    • Sample Code
      function get_accurate_position() {
      if (Modernizr.geolocation) {
      varoptions = { enableHighAccuracy:true,
      timeout:20000,maximumAge:300000};
      navigator.geolocation.getCurrentPosition(success_callback,
      error_callback,options);
      } else {
      alert("No Geo-location Support. Falling back to Gears");
      }
      }
    • Demo
    • Sample IP Data
    • Watch Position
      Same call as getPosition
      Returns a number that should be stored
      Returns position when location changes
      Device determines sample interval
      Use number to stop watching
      ClearWatch(number)
    • Sample Code
      function watch_position() {
      if (Modernizr.geolocation) {
      watchNumber= navigator.geolocation.watchPosition (success_callback,error_callback);
      } else {
      alert("No Geo-location Support. Falling back to Gears");
      }
      localStorage.setItem("watch",watchNumber);
      }
    • Sample Code
      function stop_watch(){
      varwatchNumber = localStorage.getItem("watch");
      navigator.geolocation.clearWatch(watchNumber);
      }
    • Demo
    • Fallbacks
    • Fall Back Alternatives
      Geo.js
      Google Gears
      IP Resolution
    • Mapping
      Google
      Yahoo
      Open Street Map
      Microsoft
      OpenLayers
      Cloudmade
      Mapstraction