YOU ARE DOWNLOADING DOCUMENT

Please tick the box to continue:

Transcript
Page 1: Fix All The (Map) Data! - HighEdWeb 2013 Workshop

Aaron [email protected] @farktal#heweb13 • #WRK10

Fix All The (Map) Data!Building an Interactive Campus Map

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

About Me

Aaron Knight Senior Programmer/Analyst

Information SystemsState University of New York College of Environmental Science and Forestry(SUNY-ESF)

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

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

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

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

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

Compare:

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

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.

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

Be Patient and Prepared

Be prepared for setbacks.

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

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

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

Introduction to Campus Mapping

Does it look something like this?

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

Or worse, these? Yes, these are

still live and on the web. Don’t ask.

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

What if it could look like this?

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

Part Deux

So your data is fixed now, right? Getting things right takes time. Let’s do something interesting with it!

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

You can do it!

Tools: Leaflet.js▪ And some plugins

OpenStreetMap editor Accurate campus data*

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

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

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

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.

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

Thank You!

Slides and Sample Code Contact Me

Aaron Knight@farktal on twitter [email protected]


Related Documents