Mapstraction
Ed Freyfogle - #Geomob - 18 Nov. 2009
One mapping API to
       rule them all




http://www.flickr.com/photos/workinpana/4031371930/
Why Mapstraction?
Flexibility
   • reduce dependency on single provider
   • single code base but different providers

Mix...
Property search engine
Mapstraction features
  • markers         • multiple maps/page
  • bubbles         • KML/GeoRSS
  • polygons        • even...
A bit of history
 Started in 2006

 /* Copyright (c) ${YEAR} Tom Carden, Steve Coast, Mikel
 Maron, Andrew Turner, Henri B...
“Plan to throw the first one away”
                     - Fred Brooks
http://www.flickr.com/photos/majorette/38996434/
And hence mxn v2 was born

Much smaller (20k versus 170k) note: YMMV

Much cleaner and modular

Testing infrastructure, AP...
Mini v2 tutorial

   1. include library(ies) of provider(s)-of-choice
   <script type="text/javascript">
   var cloudmade_...
Mini v2 tutorial (cont.)
3. Get to work
<div id="mapdiv" style="height: 200px; width: 400px;"></div>
<script type="text/ja...
mxn current status
mxn v2 in use and actively being developed

Support for cloudmade, geocommons, google (v2 and
v3), micr...
Thanks mxn community!
Learn more
  About mxn:
        http://www.mapstraction.com
        mapstraction@lists.mapstraction.com

  About me:
     ...
Questions/Demo?
Mapstraction
Mapstraction
Upcoming SlideShare
Loading in...5
×

Mapstraction

2,096

Published on

Ed Freyfogle's talk about Mapstraction from Nov 2009 #Geomob meeting in London

Published in: Technology, Design
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
2,096
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
0
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Mapstraction

  1. 1. Mapstraction Ed Freyfogle - #Geomob - 18 Nov. 2009
  2. 2. One mapping API to rule them all http://www.flickr.com/photos/workinpana/4031371930/
  3. 3. Why Mapstraction? Flexibility • reduce dependency on single provider • single code base but different providers Mix and match features • street view of A with satellite view of B • offer users choice Future proofing • Provider T&Cs/functionalities can change
  4. 4. Property search engine
  5. 5. Mapstraction features • markers • multiple maps/page • bubbles • KML/GeoRSS • polygons • event handling • overlays • geocoding
  6. 6. A bit of history Started in 2006 /* Copyright (c) ${YEAR} Tom Carden, Steve Coast, Mikel Maron, Andrew Turner, Henri Bergius, Rob Moran, Derek Fowler All rights reserved. … V1 available in 2006, some uptake.
  7. 7. “Plan to throw the first one away” - Fred Brooks
  8. 8. http://www.flickr.com/photos/majorette/38996434/
  9. 9. And hence mxn v2 was born Much smaller (20k versus 170k) note: YMMV Much cleaner and modular Testing infrastructure, API sandbox
  10. 10. Mini v2 tutorial 1. include library(ies) of provider(s)-of-choice <script type="text/javascript"> var cloudmade_key = ”1234…"; </script> <script src="http://tile.cloudmade.com/…-lite.js” <script src="http://maps.google.com/maps? …” 2. Include mxn <script src="mxn.js?(google,cloudmade)” …>
  11. 11. Mini v2 tutorial (cont.) 3. Get to work <div id="mapdiv" style="height: 200px; width: 400px;"></div> <script type="text/javascript"> var m = new mxn.Mapstraction('mapdiv',’cloudmade'); var latlon = new mxn.LatLonPoint( 51.52276321095246, -0.10265350341796); // put map on page m.setCenterAndZoom(latlon, 16); //add a marker var marker = new mxn.Marker(latlon); m.addMarker(marker); //change map provider on the fly m.swap('mapdiv', ’google'); </script>
  12. 12. mxn current status mxn v2 in use and actively being developed Support for cloudmade, geocommons, google (v2 and v3), microsoft, openlayers, yahoo Documentation/project page could be better Lots more to be done more providers, geocoding, new features We need your help!
  13. 13. Thanks mxn community!
  14. 14. Learn more About mxn: http://www.mapstraction.com mapstraction@lists.mapstraction.com About me: @freyfogle About Nestoria: http://www.nestoria.com @nestoria
  15. 15. Questions/Demo?

×