Zoom in on Mapping and Location

  • 3,267 views
Uploaded on

Bring the power of location to your website. Use mapping APIs to plot data geographically. Convert addresses to latitude/longitude coordinates. Grab the user's current location. Add some "where" to …

Bring the power of location to your website. Use mapping APIs to plot data geographically. Convert addresses to latitude/longitude coordinates. Grab the user's current location. Add some "where" to your application. Adam will overview the services that fuel location-based websites and some examples to help you find your way.

  • 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,267
On Slideshare
0
From Embeds
0
Number of Embeds
2

Actions

Shares
Downloads
0
Comments
0
Likes
2

Embeds 0

No embeds

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. Zoom in on Mapping and location on the Web Adam DuVander mapscripting.com
  • 2. Look familiar?
  • 3. World Map, 1513
  • 4. Wilma, I'm home http://www.flickr.com/photos/cogdog/594574/
  • 5. About me, mapping edition
  • 6. About me, Portland edition Portland Web Innovators First Wednesdays, pdxwi.com
  • 7. Mapping APIs
  • 8. Geocoding addresses to data
  • 9. Location ? guessing
  • 10. Location sharing
  • 11. But first... More history...
  • 12. RR DONNELLEY founded 1864 Cartographic Services founded 1967
  • 13. API vs mapping site http://www.flickr.com/photos/thunderpants/2744701385/
  • 14. Google Maps Driving directions StreetView It's the best?
  • 15. Yahoo Maps Automatic geocoding It's not Google
  • 16. Virtual Earth Bing Maps Bird's eye view It's not Google
  • 17. MapQuest API Nostalgia Decluttering It's not Google
  • 18. CloudMade Open data Custom tile generation Cloned Google API (but it's still not Google)
  • 19. Mapstraction: 11 maps in 1! FreeEarth OpenLayers Google OpenSpace Map24 OpenStreetMap MapQuest ViaMichelin Microsoft Yahoo MultiMap
  • 20. What's the difference? Yahoo Google Mapstraction var map = new Ymap(... var map = new GMap2(... var map = new Mapstraction(... var marker = new Ymarker(... var marker = new GMarker(... var marker = new Marker(... map.addOverlay(marker); map.addOverlay(marker); map.addMarker(marker); map.drawZoomAndCenter(... map.setCenter(... map.setCenterAndZoom(...
  • 21. What about Flash?
  • 22. 3 quick ways to make your maps stand out
  • 23. 1. Shed the teardrop icons Make shadows here: http://www.cycloloco.com/shadowmaker/
  • 24. 2. Interact outside the map
  • 25. 3. Clean things up
  • 26. Geocoding what is it?
  • 27. JavaScript geocoders Google Yahoo Mapstraction
  • 28. Server-side geocoders Google Yahoo Geocoder.US
  • 29. http://www.flickr.com/photos/blmurch/144446416/
  • 30. +--------------------------+----------+-----------+ | hotspot_name | latitude | longitude | +--------------------------+----------+-----------+ | red e cafe | 45.5626 | -122.677 | | Matchbox Lounge | 45.5046 | -122.632 | | Invasion Cafe | 45.5203 | -122.675 | | Happy Sparrow Cafe | 45.5163 | -122.635 | | mamas n' papas | 45.5226 | -122.641 |
  • 31. Location ? guessing (makes you look smart and creepy)
  • 32. 127.0.0.1 http://www.flickr.com/photos/jemstone/11631878/ http://www.flickr.com/photos/joc67/774419510/ http://www.flickr.com/photos/benimoto/419169824/
  • 33. W3C geolocation standard
  • 34. navigator.geolocation.getCurrentPosition(foundLocation, noLocation); function foundLocation(position) { var lat = position.coords.latitude; var long = position.coords.longitude; alert('Found location: ' + lat + ', ' + long); }
  • 35. position timestamp coords latitude longitude altitude accuracy altitudeAccuracy heading speed
  • 36. Google Ajax loader google.loader.ClientLocation
  • 37. IPinfoDB.com +--------------------------+----------+-----------+ | ip_address | latitude | longitude | +--------------------------+----------+-----------+ | 192.168.0.1 | 45.5626 | -122.677 | | 192.168.0.2 | 45.5046 | -122.632 | | 192.168.0.3 | 45.5203 | -122.675 | | 192.168.0.4 | 45.5163 | -122.635 | | 192.168.0.5 | 45.5226 | -122.641 |
  • 38. Location sharing (only as creepy as you make it)
  • 39. http://www.flickr.com/photos/8363028@N08/2874693272/
  • 40. How will ? you use location
  • 41. Zoom in on Mapping and location on the Web (Thank you) Adam DuVander mapscripting.com