Aaron Knight [email protected] @farktal #heweb13 • #WRK10 Fix All The (Map) Data! Building an Interactive Campus Map
Jun 26, 2015
Aaron [email protected] @farktal#heweb13 • #WRK10
Fix All The (Map) Data!Building an Interactive Campus Map
About Me
Aaron Knight Senior Programmer/Analyst
Information SystemsState University of New York College of Environmental Science and Forestry(SUNY-ESF)
Outline for This Afternoon
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
Background
One Map To Rule Them All? Don’t we wish!
How much has your campus changed in the last few years? Have mapping services caught up? Many tools, many data sources
Compare:
Fixing Map Data
Often a tedious process. Making complete edits is important.
Often expedites review Yes, you will have to do this in many places.
Be Patient and Prepared
Be prepared for setbacks.
Fixing Map Data - Demo
Let none of these sites be down this afternoon… http://www.google.com/mapmaker/ http://www.openstreetmap.org http://www.here.com
Introduction to Campus Mapping
Does it look something like this?
Or worse, these? Yes, these are
still live and on the web. Don’t ask.
What if it could look like this?
Part Deux
So your data is fixed now, right? Getting things right takes time. Let’s do something interesting with it!
You can do it!
Tools: Leaflet.js▪ And some plugins
OpenStreetMap editor Accurate campus data*
First Steps
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
Integration
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 Don’t fret.