✕
Grid Island City Walk, drive, cycle and fly a generated city
A narrow island, an avenue grid rotated 29°, a diagonal avenue, a big park, two rivers with bridges and skyscraper clusters — all generated in your browser from a seed.
Fictional generated city. Inspired by Manhattan-style grids; no real map data, names or code.
Models Checks Traffic City About
Fictional generated city — a teaching model, not a map. Every constant marked "illustrative" is chosen for looks and clarity, not measured.
1. Land value and building height (bid-rent)
Firms compete for land near the centre. In the textbook monocentric model the winning bid falls roughly exponentially with distance d from a business district; taller buildings are built where land is dear, so height follows land value to a power.
L(d) = L0 · exp(-d / λ) bid-rent gradient
H(d) = H0 · (L / L0)^β height ~ land value^β
=> ln H = ln H0 - (β/λ) · d straight line on a log plot
here: λ = 700 m, β = 1.35, H0 = 380 m (midtown) / 330 m (downtown)
lognormal scatter σ = 0.28, floors of 3.6 m, minimum 9 m (illustrative)
Two centres (midtown and downtown) give the typical two-cluster skyline; the height of a parcel uses the nearer/stronger centre. Parcels beside the park get a +25 % "park premium". The Checks tab fits the slope from the buildings actually generated.
2. The grid, block size and walking time
avenue pitch 150 m × street pitch 70 m (illustrative; real blocks vary)
walking speed 5 km/h = 1.389 m/s => one avenue block 108 s, one street block 50 s
grid distance D_grid = |Δx| + |Δz| mean(D_grid / D_euclid) = 4/π ≈ 1.273 (isotropic)
The whole grid is rotated 29° from true north and the sun and compass use that rotation. Click the minimap to set a waypoint and compare straight-line, grid and drive times. The diagonal avenue is a shortcut the grid formula ignores.
3. Sun, day and night
sin a = sinφ sinδ + cosφ cosδ cos H H = 15°/h · (t - 12 h)
cos A = (sinδ - sin a sinφ) / (cos a cosφ)
φ = 40.7° N, δ = +14° (a mid-spring day)
Windows light up when the sun is below about -8°; each window is on or off by a hash of its floor and bay, so every night looks different but is repeatable.
4. Helicopter and camera ground speed
v_ground = |dr/dt| (no wind modelled) auto-tour: constant-speed closed Catmull-Rom spline
lap time T = L_spline / v
Honest simplifications
Traffic lights are fixed-time and cars never change lane or turn; cross traffic is prevented only by the signal phases. The diagonal avenue has no signals.
Buildings are boxes with tiers, hip roofs and spires; windows come from one generated facade atlas. No interiors.
Walking, car and bicycle motion are simple kinematic models, not full vehicle dynamics. Helicopter flight is arcade-style.
Weather changes light, fog, wet roads and rain streaks only; there is no wind or cloud simulation.
The island, park, rivers and bridges are rule-generated; they only resemble real places by design idea.
Independent numerical checks, computed in your browser right after the city is generated. They compare the generated data with a closed form or a separate re-implementation.
Log-height of generated buildings against distance from their centre, with the fitted line.
Intelligent Driver Model (IDM)
dv/dt = a [ 1 - (v/v0)^4 - (s*/s)^2 ]
s* = s0 + v T + v Δv / (2 √(a b))
a = 1.4 m/s², b = 2.0 m/s², T = 1.1-1.6 s, s0 = 2 m, car length 4.6 m
v0 = 54 km/h (avenues), 40 km/h (streets), 47 km/h (diagonal) (illustrative)
Fundamental diagram
For uniform flow (all cars equal speed) the gap is s_e = (s0 + vT) / √(1 - (v/v0)^4) and the flow is q = ρ v with ρ = 1 / (s_e + L).
Line: closed form. Dots: ring-road simulation of this page's IDM code (see Checks). Yellow dot: cars around you right now.
Real roads show stop-and-go waves, lane changes and turning; this model keeps one lane per direction segment and fixed-time signals.
Live city statistics
Controls
Walk: WASD / arrows, Shift to sprint, drag to look. Drive and bike: W/S throttle and brake, A/D steer, Space handbrake. Helicopter: W/S speed, A/D turn, Space / Q up, Shift / E down, T toggles the auto-tour. Orbit: drag, wheel, right-drag to pan. Keys 1-5 change mode, P photo mode, M map zoom. Touch: left thumb joystick, right thumb to look.
Built with Three.js r160 (WebGL), vendored locally. No downloaded city data: every building, road, tree and vehicle is generated from the seed in your browser, and the facade atlas is painted once on a canvas. The only model files are the animated people (below).
Animated people. One humanoid was generated with Meshy AI (text-to-3D, then Meshy's automatic rigging and its walk / idle / run animation library), then reduced in Blender to 1.5k triangles for the crowd (a 512 px baked texture; the walk and idle cycles are baked into a vertex-animation texture so up to 400 pedestrians draw in a single instanced call, each with its own phase, speed, size and tint) and 2.2k triangles with a skeleton for the one hero walker you can approach. Pedestrians keep to the sidewalks and wait at kerbs while the crossing signal is red (the same 48 s cycle the cars obey). The slider and the time of day set the crowd size; Low halves it. Honest simplification: all pedestrians share one body shape and one gait, only tint, size and tempo differ; they do not avoid each other.
Inspired by the general idea of procedural, rule-based city generators; it shares no code, names or data with any of them. It is a fictional city and is not affiliated with any real place or organisation.
Rendering: instanced and merged geometry per chunk, a facade atlas with a window mask for night lighting, cascaded-free single shadow map that follows you, fog, sky dome, a light bloom pass. Quality is High by default; use the Quality button or ?q=low.