Location Aware Browsing
Upcoming SlideShare
Loading in...5
×

Like this? Share it with your network

Share

Location Aware Browsing

  • 3,575 views
Uploaded on

 

  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
No Downloads

Views

Total Views
3,575
On Slideshare
3,516
From Embeds
59
Number of Embeds
2

Actions

Shares
Downloads
57
Comments
0
Likes
1

Embeds 59

http://blog.aizatto.com 52
http://navigator.nmc.org 7

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide

Transcript

  • 1. Location Aware Browsing Aizat Faiz aizat.faiz@gmail.com http://www.flickr.com/photos/st3f4n/2860706946/ http://creativecommons.org/licenses/by/3.0/
  • 2. http://www.flickr.com/photos/st3f4n/2860706946/ http://creativecommons.org/licenses/by/3.0/ Download and view at http://blog.aizatto.com/?p=3847
  • 3. Creative Commons http://www.flickr.com/photos/st3f4n/2860706946/ http://creativecommons.org/licenses/by/3.0/
  • 4. By Attribution http://www.flickr.com/photos/thevoicewithin/551651500/ http://creativecommons.org/licenses/by/3.0/
  • 5. Aizat Faiz [email_address]
  • 6. http://www.flickr.com/photos/willpate/111479065/
  • 7. HTML 5 http://www.flickr.com/photos/willpate/111479236/
  • 8. JavaScript http://www.flickr.com/photos/nyuhuhuu/3367743012/
  • 9. HTML 5 introduces an API to interact with Geolocation services Interaction is done via JavaScript http://www.flickr.com/photos/mrbill/2481198023/
  • 10. How does it find your location? Google Latitude GPS http://www.flickr.com/photos/sejhok/2343828092/
  • 11.  
  • 12. navigator.geolocation Geolocation API Specification http://dev.w3.org/geo/api/spec-source.html
  • 13. JavaScript Object Geolocation API Specification http://dev.w3.org/geo/api/spec-source.html
  • 14. 2 kinds of variables 3 functions 2 kinds of callbacks Simple API http://dev.w3.org/geo/api/spec-source.html
  • 15. Mozilla Firefox v3.5+ Browser Support Apple Safari 5 Google Chrome 5
  • 16. http://dev.w3.org/geo/api/spec-source.html
  • 17. 2 Variables Coordinates Position http://dev.w3.org/geo/api/spec-source.html#api_description
  • 18. http://dev.w3.org/geo/api/spec-source.html#api_description 3 Functions navigator.geolocation. getCurrentPosition navigator.geolocation. watchPosition navigator.geolocation. clearWatch
  • 19. http://dev.w3.org/geo/api/spec-source.html#api_description 2 Callbacks Success Callback Error Callback
  • 20. http://dev.w3.org/geo/api/spec-source.html#api_description Geolocation API Specification variables Coordinates Position functions navigator.geolocation.getCurrentPosition navigator.geolocation.watchPosition navigator.geolocation.clearWatch Callbacks Success Callback Error Callback
  • 21. http://dev.w3.org/geo/api/spec-source.html#api_description
  • 22. http://dev.w3.org/geo/api/spec-source.html#api_description 2 Variables Coordinates Position
  • 23. http://dev.w3.org/geo/api/spec-source.html#api_description JavaScript Objects
  • 24. http://dev.w3.org/geo/api/spec-source.html#coordinates_interface
  • 25. http://dev.w3.org/geo/api/spec-source.html#coordinates_interface Coordinates
  • 26. http://dev.w3.org/geo/api/spec-source.html#coordinates_interface Describe location Coordinates
  • 27. http://dev.w3.org/geo/api/spec-source.html#coordinates_interface Coordinates
  • 33. http://dev.w3.org/geo/api/spec-source.html#coordinates_interface Coordinates Description Variable Name Latitude coordinates.latitude Longitude coordinates.longitude Accuracy coordinates.accuracy Altitude coordinates.altitude Altitude Accuracy coordinates.altitudeAccuracy Heading coordinates.heading Speed coordinates.speed
  • 34. http://dev.w3.org/geo/api/spec-source.html#position_interface
  • 35. http://dev.w3.org/geo/api/spec-source.html#position_interface Position
  • 36. http://dev.w3.org/geo/api/spec-source.html#position_interface Describes Time and Location Position
  • 37. http://dev.w3.org/geo/api/spec-source.html#position_interface Position Timestamp and Coordinates
  • 38. http://dev.w3.org/geo/api/spec-source.html#position_interface Position Description Variable Name Coordinates position.coordinates Timestamp position.timestamp
  • 39. http://dev.w3.org/geo/api/spec-source.html#position_interface Coordinates and Position Coordinates Position coordinates.latitude position.coordinates coordinates.longitude position.timestamp coordinates.accuracy coordinates.altitude coordinates.altitudeAccuracy coordinates.heading coordinates.speed
  • 40. http://dev.w3.org/geo/api/spec-source.html#get-current-position
  • 41. http://dev.w3.org/geo/api/spec-source.html#get-current-position navigator.geolocation.getCurrentPosition
  • 42. http://dev.w3.org/geo/api/spec-source.html#get-current-position navigator.geolocation.getCurrentPosition Returns current Position
  • 43. JavaScript Implementation
  • 44. navigator.geolocation.getCurrentPosition
  • 45. navigator.geolocation.getCurrentPosition ① ③ ② ① browser object ② function call ③ success callback
  • 46. navigator.geolocation.getCurrentPosition
  • 47. HTML and JavaScript Implementation
  • 48. navigator.geolocation.getCurrentPosition
  • 49. navigator.geolocation.getCurrentPosition if condition is required, in case browser does not support geolocation
  • 50. Your browser will try to request permissions to determine your location
  • 51. Mozilla Firefox v3.5+
  • 52. Google Chrome 5
  • 53. Apple Safari 5
  • 54. ① ② ① success callback ② error callback
  • 55. The Building Blocks
  • 56. Location Aware Browsing Aizat Faiz aizat.faiz@gmail.com http://www.flickr.com/photos/st3f4n/2860706946/ Thank You