Geolocation in Web and Native Mobile Apps


Published on

While location-based mobile apps are becoming increasingly popular, they are still relatively new. Special considerations need to be made for battery life and handling large data sets of geolocated data. The good news is there are many services and technologies you can use to assist you in building mobile location-based apps.
In this session, Aaron Parecki, co-founder of, shows you services you can leverage to do things like nearby business lookups, location-based triggers, nearest intersection queries, and more. Aaron also covers the location services available on the various mobile platforms as well as in HTML 5, and shares some insights on how to deal with battery life. The session concludes with some real-world use cases for real-time location such as turning on and off your lights in your house or sending an SMS when you leave work.

Published in: Technology

Geolocation in Web and Native Mobile Apps

  1. 1. Geolocation in Web and Mobile Apps Aaron Parecki – Web Directions – May – – @aaronpk Slides and code available at
  2. 2. Displaying a Map@aaronpk
  3. 3. Displaying a Map - HTML@aaronpk
  4. 4. Displaying a Map - iPhone@aaronpk
  5. 5. Displaying a Map - Android@aaronpk
  6. 6. Finding the User’s Location@aaronpk
  7. 7. Browser Geolocation !   Desktop browsers use nearby wifi hotspots !   Mobile devices may use GPS or cell tower positioning !   You can also use IP lookups to get a rough location (but is usually very inaccurate)@aaronpk
  8. 8. Browser Geolocation with Wifi@aaronpk
  9. 9. Browser Geolocation@aaronpk
  10. 10. Browser Geolocation@aaronpk
  11. 11. Finding the User’s Location using Javascript@aaronpk
  12. 12. Browser Geolocation@aaronpk
  13. 13. Browser Geolocation !   Usability problem with this approach: !   User is left with an empty page waiting for them to press “allow” !   You should do the best you can with no location, and then update your page after you get the user’s location !   Could use IP-based location to center a map somewhere that is (probably) nearby@aaronpk
  14. 14. Using SimpleGeo Start with IP-based geolocation to quickly center the map. Update with browser-based geolocation after it’s available.
  15. 15. Finding Nearby Businesses ! SimpleGeo Places !   Foursquare API !   Twitter API !   Yelp API !   Google Places API !   Many others@aaronpk
  16. 16. Place Search with Foursquare
  17. 17. Place Search with SimpleGeo@aaronpk
  18. 18. Place Search with SimpleGeo
  19. 19. Finding Information About a Location@aaronpk
  20. 20. SimpleGeo Context@aaronpk
  21. 21. SimpleGeo Context@aaronpk
  22. 22. Monitoring Continuous Location@aaronpk
  23. 23. Monitoring Continuous Location in Javascript Now go run around outside! (But keep the browser open)@aaronpk
  24. 24. Keep the browser open? That’s kind of lame.@aaronpk
  25. 25. Monitoring Continuous Location on the iPhone This will keep running in the background! (But now you will potentially drain the battery)@aaronpk
  26. 26. Saving battery by Getting the User’s Approximate Location@aaronpk
  27. 27. Retrieving Approximate Location on the iPhone [locationManager startMonitoringSignificantLocationChanges]; •  Your app will be re-launched in the background when the user moves “significantly” •  Most likely when they change cell towers •  Location is very rough, ~500-1500m accuracy@aaronpk
  28. 28. Retrieving Approximate Location on Android locationManager.requestLocationUpdate( LocationManager.PASSIVE_PROVIDER, 0, 0, listener); •  Service runs in the background, gets locations when other providers or apps request location. •  Could be cell tower location, could be GPS@aaronpk
  29. 29. Location-Based Triggers@aaronpk
  30. 30. Geonotes Try it! Reminders@aaronpk
  31. 31. Trigger-Based Actions Create triggers based on where users are.@aaronpk
  32. 32. Send a message to all userswithin a radius.@aaronpk
  33. 33. ArrivedNotify X when you arrive at place Y@aaronpk
  34. 34. Real-time location-based gaming@aaronpk
  35. 35.
  36. 36. Hybrid Web/Native App Web Views@aaronpk
  37. 37. Communicating Between the Web and Native Components@aaronpk
  38. 38. Communicating Between the Web and Native Components@aaronpk
  39. 39. Turning On/Off Your Lights Geoloqi  API   Your  Home   Server   X10   Your  Home  And sending an SMS when you leave work Lights  @aaronpk
  40. 40. X10 Lamp Switch Linux Command Line X10 Client $ heyu on A1@aaronpk
  41. 41. @aaronpk
  42. 42. Create a Layer in Geoloqi Docs:
  43. 43. Create a Trigger in Geoloqi Docs:
  44. 44. Handling a Trigger from Geoloqi Docs:
  45. 45. Create an SMS Number      or  @aaronpk
  46. 46. Send an SMS@aaronpk
  47. 47. Questions? Code: Geoloqi API: SMS API: Aaron Parecki @aaronpk@aaronpk