Campus Crusher

How it's made: from OpenStreetMap to a 3D campus

Nobody modeled 2,239 campuses by hand. Each one is generated from public map data by a small set of scripts, and then rendered live in your browser.

1. Finding the campuses

OpenStreetMap marks a university's grounds as an area tagged amenity=university (or college). The scripts ask for every such area in a region through the Overpass API or a regional data extract, then collect the buildings, roads, paths, trees and water inside each one. Universities rarely fit a tidy boundary, with satellite sites and medical campuses spread across a city, so some campuses need correcting by hand. A single campus can also be refetched from OpenStreetMap's main API when the bulk download misses it.

2. Working out how tall each building is

A map is flat, so height is the hard part. The pipeline tries three sources in order:

  1. An explicit height. If a mapper recorded height=38, the building is 38 meters tall.
  2. A floor count. With building:levels, the height is levels × 3.6 m + 1.5 m, plus 2.5 m per level of roof. A 6-story building therefore comes out at 23.1 m.
  3. An estimate from the building type. With neither, it uses a default: 14 m for academic buildings, 13 m for housing, 15 m for sports buildings, 18 m for chapels, 8 m for garages and sheds and 11 m for anything else. Buildings under 200 m² are scaled to 70% of that so sheds don't tower over the quad.

Heights are kept between 3 and 150 meters. A few well-known buildings that the map gets wrong have manual corrections, many of them from player reports. This is why the site always says that heights are estimated where the map has none.

3. Sorting buildings by type

The OpenStreetMap building tag decides the look and the default height. dormitory and apartments become housing, stadium and sports_hall become sports buildings, church and chapel become places of worship, and garage and shed become service buildings. Roof tags choose between flat, pitched and domed roofs.

4. Adding terrain

Campuses aren't flat. Where elevation data is available, each campus gets a height grid so roads and buildings sit on the real hills, and vehicles tilt to follow them. Foundations extend down on slopes so buildings don't float.

5. Keeping it small

Each campus is one small JSON file, loaded only when you open it. Coordinates are stored as local offsets with limited precision, and the game draws up to 650 of a campus's buildings, keeping those nearest its center. That lets the game offer 2,239 campuses without a heavy download.

6. Rendering in the browser

The game draws everything live with three.js, on WebGL. Buildings are extruded from their map footprints, with procedural wall textures. When a building breaks, its volume becomes a cloud of debris pieces drawn efficiently as one instanced mesh, which is how a phone can handle a collapsing campus. Sounds are synthesized in the browser rather than loaded from audio files.

Why open data matters

Every campus here exists because volunteers walked around and mapped it. If yours looks thin, you can improve the source. It helps every app that uses OpenStreetMap, and the improvement reaches these games the next time that campus's data is refreshed.