An Interactive Web Visualization for Watershed Topology
summary
An open source JavaScript web app that actually maps where rain flows by using the USGS Watershed Boundary Dataset to build a directed acyclic graph of ~100,000 hydrologic polygons and compute upstream and downstream catchments by reverse DAG traversal. It converts data to TopoJSON to store shared edges once, simplifies geometry to cut a 6 GB source to ~50 MB, and renders with Leaflet + canvas plus precomputed merged blobs for interactive framerates; mobile taps fetch HUC IDs and per-watershed topojson.
AI-written summary · about
chapters (11)
- 0:00Introduction
- 0:52Project Description
- 1:51Demo
- 8:01Conceptual Explanation
- 12:37Directional Graphs
- 14:17Terrain Grid
- 16:47Inverse DAG
- 22:27Watershed Boundary Dataset
- 27:12Interactive Map Optimization
- 29:34Mobile Version
- 32:14Questions
related talks
10mUpstream/Downstream: Discovering and Displaying Watershed Topology!
27mCartography on the Web
48mData Visualization in Practice
01h 41mOpenStreetWhat? Mapping The World With Open Data
49mSaving the world with JavaScript: A Data Visualization story
01h 34mBuild a Web Map with Open Source Tools
25mA Journey Through a Geospatial Data Pipeline: From Raw Coordinates to Actionable Insights
22mSpatial Analysis and the Geoweb