際際滷

際際滷Share a Scribd company logo

Fix All The (Map) Data! - HighEdWeb 2013 Workshop

Download as PPTX, PDF
F
farktal

Campus Mapping: so many data sources, competing services, and oh so many pieces of data to correct. We'll first look at common systems (Google MapMaker, OpenStreetMap, and HERE MapCreator) with which errors about your campus physical plant can be corrected - and then work through the process of building an interactive campus map using Leaflet.js, a few plugins, and a combination of those data sources (fairly) easily for your own campus. Workshop will require at least a working knowledge of JavaScript. SUNY-ESF has been exploring various means of using external map data to offer a strong campus map for several years, and rapid changes to the physical plant of their Syracuse campus have required learning how to get changes made to services like Google Maps so that campus visitors are well-directed to campus.

1 of 16
Download to read offline
Aaron Knight acknight@esf.edu @farktal #heweb13 #WRK10
Aaron Knight Senior Programmer/Analyst Information Systems State University of New York College of Environmental Science and Forestry (SUNY-ESF)
Background Fixing Map Data Introduction to Campus Mapping Ways to Integrate Map Services Using Leaflet.js Building an Interactive Map Integrating Leaflet.js in Your CMS* Conclusion/Q&A
One Map To Rule Them All? Dont we wish! How much has your campus changed in the last few years? Have mapping services caught up? Many tools, many data sources
Fix All The (Map) Data! - HighEdWeb 2013 Workshop
Often a tedious process. Making complete edits is important. Often expedites review Yes, you will have to do this in many places.
Be prepared for setbacks.
Let none of these sites be down this afternoon http://www.google.com/mapmaker/ http://www.openstreetmap.org http://www.here.com
Does it look something like this?
Yes, these are still live and on the web. Dont ask.
Fix All The (Map) Data! - HighEdWeb 2013 Workshop
So your data is fixed now, right? Getting things right takes time. Lets do something interesting with it!
Tools: Leaflet.js And some plugins OpenStreetMap editor Accurate campus data*
Download Files http://www.acknight.com/slides/heweb13files.zip Leaflet.js Quick Start Guide http://leafletjs.com/examples/quick-start.html Find Your Center Build Your Base Map
WordPress: Maps Marker plugin http://www.mapsmarker.com Visually create maps, full icon set. Free or paid gmaps.js Similar, Google API-driven Requires jQuery http://hpneo.github.io/gmaps/ Your CMS May Vary Dont fret.
際際滷s and Sample Code Contact Me Aaron Knight @farktal on twitter acknight@esf.edu

More Related Content

Fix All The (Map) Data! - HighEdWeb 2013 Workshop

  • 2. Aaron Knight Senior Programmer/Analyst Information Systems State University of New York College of Environmental Science and Forestry (SUNY-ESF)
  • 3. Background Fixing Map Data Introduction to Campus Mapping Ways to Integrate Map Services Using Leaflet.js Building an Interactive Map Integrating Leaflet.js in Your CMS* Conclusion/Q&A
  • 4. One Map To Rule Them All? Dont we wish! How much has your campus changed in the last few years? Have mapping services caught up? Many tools, many data sources
  • 6. Often a tedious process. Making complete edits is important. Often expedites review Yes, you will have to do this in many places.
  • 7. Be prepared for setbacks.
  • 8. Let none of these sites be down this afternoon http://www.google.com/mapmaker/ http://www.openstreetmap.org http://www.here.com
  • 9. Does it look something like this?
  • 10. Yes, these are still live and on the web. Dont ask.
  • 12. So your data is fixed now, right? Getting things right takes time. Lets do something interesting with it!
  • 13. Tools: Leaflet.js And some plugins OpenStreetMap editor Accurate campus data*
  • 14. Download Files http://www.acknight.com/slides/heweb13files.zip Leaflet.js Quick Start Guide http://leafletjs.com/examples/quick-start.html Find Your Center Build Your Base Map
  • 15. WordPress: Maps Marker plugin http://www.mapsmarker.com Visually create maps, full icon set. Free or paid gmaps.js Similar, Google API-driven Requires jQuery http://hpneo.github.io/gmaps/ Your CMS May Vary Dont fret.
  • 16. 際際滷s and Sample Code Contact Me Aaron Knight @farktal on twitter acknight@esf.edu

Editor's Notes

  1. Photo credits: http://www.westga.edu/~distance/orientation/roadsign.jpghttp://www.iclickfun.com/wp-content/uploads/2011/09/magic-roundabout-swindon.jpgGoogle Maps/Earth imagery, Buffalo
  2. Background 5 minutesFixing Data 5 minutes intro, 15-20 minutes per service demo, 15-20 minutes of data correction with attendees?Intro to mapping 5 minutesIntegration 5-10 minutesTutorial in Leaflet.js 15-20 minutesBuilding map 1-1.5 hoursIntegration services overview/next steps 5-10 minutes