All projects

Systems & Graphics

3D Campus Digital Twin

University of Birmingham, Edgbaston

A real campus reimagined in interactive 3D.

Role
Design and development.
Status
Live demo, open source
Year
2026
Live demo (opens in a new tab)GitHub (opens in a new tab)
Overhead 3D view of the University of Birmingham campus, with Old Joe clock tower, the Aston Webb building and surrounding buildings extruded from real footprints.
Chancellor's Court from above.

01

The problem

Campus maps are flat and static. I wanted a space you can actually explore that is accurate to the real campus, with real building outlines and real paths, without photogrammetry or licensed imagery.

02

My contribution

I built it end to end: the OpenStreetMap extraction, the footprint-to-mesh pipeline, procedural textures and landscaping, the bespoke Old Joe and Aston Webb models, picking and the camera system, and the Map and Directions routing.

  • Three.js
  • TypeScript
  • WebGL
  • OpenStreetMap
  • Dijkstra routing

03

How it works

  1. Extract

    Query OpenStreetMap through Overpass for named university buildings and real footpaths inside the campus bounding box.

  2. Project

    Convert every footprint polygon to local metres around Old Joe, using one real-world mapping shared by the scene and live GPS.

  3. Generate

    Extrude each footprint into a massed building with a procedural facade, plinth, cornice and rooftop clutter.

  4. Route

    Snap start and destination to the path graph and run Dijkstra to draw a walking route with distance and time.

04

Engineering details

  • Real footprints, not guesses

    Position, plan shape and height come from OpenStreetMap data. The facade detail on generic buildings is simplified, and the project says so rather than passing it off as a scan.

  • Instancing

    Three tree species, foundation shrubs and 1,000+ lamp posts along the real paths are drawn with instanced meshes, so the draw-call count stays low however many there are.

  • Procedural textures

    Brick, stone, grass with mowing stripes, sky and window-grid facades are all generated on a canvas at startup. No imagery is downloaded or scraped.

  • One coordinate system

    Live GPS fixes go through the same projection the 3D scene is built on, so the you-are-here marker lines up exactly. A manual pin works when location is unavailable.

  • A camera that stays a map

    Orbit controls are capped so the view always reads as tilting a satellite map, with a separate 360 degree viewer for the two bespoke landmarks.

05

Results & limitations

You can orbit the campus, click any of the 60 buildings to fly to it, open a 360 degree viewer on Old Joe or the Aston Webb building, and get walking directions along real paths from a live GPS fix or a dropped pin.

  • 60

    campus buildings

    58 from OpenStreetMap footprints plus 2 bespoke landmarks.

  • ~430

    OSM path segments

    Merged into one mesh and reused for tree placement, lamp posts and walking routes.

  • 0

    downloaded textures

    Every texture is generated at startup.

Limitations and honest caveats

  • Building facades are simplified massing on real footprints, not photogrammetry.
  • Only Old Joe and the Aston Webb building have bespoke models and an Explore in 3D viewer.
  • Terrain elevation is a small procedural undulation, not survey contour data.
  • Generic buildings do not cast shadows yet. The sun's shadow frustum is sized for the central courtyard.