A showcase of interactive geospatial projects built in GEOG 414 at UCLA — from Leaflet thematic maps to D3-powered inequality visualizations.
34.0689° N | 118.4452° W · Los Angeles, CA
About
Through GEOG 414, I have built a full-stack skill set in web-based geospatial technologies — writing front-end JavaScript, HTML, and CSS from scratch through to configuring and deploying the Linux web servers that host these applications.
I am comfortable creating thematic and interactive maps with Leaflet.js, constructing data-driven SVG visualizations with D3.js, integrating hosted vector tile and WMS/WMTS image tile services, and applying cartographic design principles to communicate spatial patterns effectively.
Technologies
Portfolio
Five projects completed across GEOG 414, each building toward a complete web GIS skill set.
Unit 1
Foundations of HTML, CSS, and JavaScript for the web. Covers DOM manipulation, event handling, and the core programming concepts that underpin all subsequent mapping projects.
View ProjectUnit 2
Building choropleth and proportional-symbol maps using Leaflet.js. Includes loading GeoJSON layers, custom class-break symbology, dynamic legends, and attribute-driven popups.
View ProjectUnit 3
Integrating Mapbox vector tile basemaps and WMS/WMTS image tile services into interactive Leaflet maps with layer-switching controls and dynamic overlays.
View ProjectUnit 4
Data-driven cartographic visualization using D3.js. Leverages SVG rendering, sequential color scales, and geographic projections to map socioeconomic inequality from real-world datasets.
View ProjectUnit 5
A live Leaflet map of M2.5+ earthquakes from the past 30 days, sourced from the USGS GeoJSON feed. Proportional circles scaled by magnitude, color-coded by focal depth, with hover tooltips and click popups linking to full USGS event records.
View ProjectMore projects on the way