Nunusavi

Geospatial / Data Visualization

Addis Ababa 3D City Explorer

I built an interactive 3D map of Addis Ababa from a raw 1GB geospatial pipeline.

~1GB GeoJSON city dataset

sourceData

Z12–Z17 PBF vector tiles

tileZoomRange

Overture Maps: buildings, roads, places

dataSources

Overview

This project started with a single question: what does Addis Ababa actually look like as data? I sourced a roughly 1GB GeoJSON file of the city's building footprints and set out to turn it into something interactive and fast in a browser. That meant building a real pipeline not just dropping data into a library. I wrote Python scripts to sample, tile, and process the source data using a locally built Tippecanoe binary, generating PBF vector tiles across zoom levels 12 through 17. I then pulled roads, buildings, and places from Overture Maps via their S3 API and tiled those too. The frontend uses MapLibre GL JS to render the result as a dark-themed 3D explorer with switchable basemaps, road class filtering, and real cluster counts all served from a local tile server with no paid API dependencies.

The Process

01

Challenge

There was no accessible, performant, open-source visualization of Addis Ababa's urban data just large raw files with no interactivity or geographic context.

02

Approach

I built a four-stage data pipeline: sample → tile with Tippecanoe (PBF) → fetch supplementary Overture data → re-tile by category. On the frontend, I authored the full MapLibre config with custom layer styles, 3D building extrusion, road class legend, clustering for places, and a control panel with basemap switching all in vanilla HTML/JS with zero framework overhead.

03

Outcome

The explorer brings Addis Ababa's urban geography to life in a browser. It is a functional geospatial tool and a proof of what is possible with open data and a well-designed pipeline built entirely outside paid mapping services.

Key Highlights

  • 01Processed ~1GB GeoJSON into PBF vector tiles across zoom levels 12–17
  • 02Integrated Overture Maps buildings, roads, and places layers
  • 03Zero paid API dependencies fully self-hosted tile pipeline

Capabilities

3D building extrusion renderingRoad class color legend and filteringPlace clustering with count badgesSwitchable basemaps: Dark Matter, Positron, VoyagerFly-to Addis Ababa navigation controlSelf-hosted tile server no paid APIs