GEOG 371: Web Mapping

Instructor: Bo Zhao, [email protected] | Office Hours: W 1400-1500 or by appt. @STRAND 347

Lecture: MWF 1200 - 1250 @WLKN 235 | Lab: Th 1000 to 1150 @WLKN 210

Catalog course description: GEOVISUALIZATION: WEB MAPPING (4).

Current developments in Internet mapping and advanced cartographic skills applied to web-based maps. Techniques of Internet mapping and principles of web-based cartography, including multimedia, animation, 3D visualization, and user interface design. PREREQS: GEOG 201 or GEO 301.

Welcome to GEOG 371: Web Mapping 🌎! This course introduces current developments in web mapping and advanced cartographic skills applied to interactive map design. By using open sourced libraries (Leaflet, Cesium, storymap.js, Bootstrap, jQuery), free or open source software (QGIS, Webstorm), project management services (GitHub), and web mapping services (GeoServer, MapBox), students can learn both the principles of web-based cartography and the practical skills for web mapping, and develop the capabilities of map aesthetics and critique. The lectures focus on the theories and principles behind web mapping, including system architecture, responsive design, user graphic design, map design and geo-narrative. The lab exercises focus on practical skills for web programming, 2d and 3d web mapping, web mapping services, and digital storytelling. The mid-term focuses on basic concepts and web programming techniques. There is no final exam, but each student is expected to design a web map and deploy it to an openly accessible server. Feel free to contact Dr. Bo Zhao for more information. 🙋

Week	Lecture (M)	Lecture (W)	Lab (Th)	Lecture (F)	Reading
Wk 00	N/A	Intro to the Course	Lab 1: Project Management for Web Mapping	Intro to Web Mapping	Markdown, Links and Command Lines
Wk 01	Web Programming Basics I: HTML 5 and CSS	System Architecture for Web Mapping	Lab 2: Web Programming Basics II: Javascript	Web Programming Basics III: JQuery	HTML, CSS and Javascript
Wk 02	Spatial Data for Web Mapping, 🙌Final Project Guidelines	Map Client I: Basics and Geographic Features	Lab 3: Web Map Design	Map Client II: Map Events and Mashup	Leaflet and GeoJson
Wk 03	Map Client III: Web Map Interaction	Map Server I: Intro to GeoServer	Lab 3: Cont'd	Map Server II: Styling	GeoServer docs
Wk 04	Map Server III: Web Map Services	Map Server IV: Base Map Design using Mapbox	Lab 4: Web Map Services and Basemap	Midterm Exam	Bing Map Tile, and GeoWebCache
Wk 05	Map Server V: Map Tiles	Map Design I: Web Template and Framework	Lab 4: Cont'd	Map Design II: Bootstrap	Bootstrap docs, Kosara and Mackinlay (2013)
Wk 06	Storytelling with Web Map I	Storytelling with Web Map II	Lab 5: Story Map	Map Design III: User Friendly Design Principles	storymap.js
Wk 07	TweetMap	HeatMap	Lab 5: Cont'd	Veterans Day
Wk 08	Map Design IV: Map Critiques	3D Web Mapping I: Basics	Lab 6: Thematic Map on the Virtual Globe	3D Web Mapping II: Build a Virtual Environment
Wk 09	3D Web Mapping III: Thematic Map on a Virtual Globe	Final Project Discussion and Preparation	Lab 6: Cont'd	Thanksgiving Break
Wk 10	Emerging Topics on Web Mapping	Final Project Discussion and Preparation	Final Project Discussion and Preparation	Final Project Presentation	Elwood et al. (2012), Sui and Zhao (2015)

Syllabus

Final Project

• Guideline (WK02)
• Proposal (WK03)
• Data Source Table (WK04)

Texts

No required textbook, but required papers and online materials will be available on the course repository on GitHub.

Programming Languages

Html, CSS, Javascript, Markdown and GeoJson

Desktop Software

Chrome, Webstorm, Typora, QGIS, and GeoServer ​

Web Services

GitHub, jsfiddle, Mapbox, W3Schools, and geojson.io ​

Libraries for Web Mapping

Jquery, Bootstrap, Leaflet, Storymap.js, and Cesium

Previous Years

2017 Winter

• 🏆 A story map on Infrastructure for Water Management from a former student has won the environmental challenge 2017

Credits

This course material is maintained by the Cartography and Geovisualization Group at Oregon State University. Some of the material in this course is based on the classes taught at MIT and Penn State University. We have heavily drawn on materials and examples found online and tried our best to give credit by linking to the original source. Please contact us if you find materials where the credit is missing or that you would rather have removed.