Embed Size (px)
DESCRIPTION
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.
Citation preview
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.
