Tulsa Shadow Walk

A real-time MapLibre shade-walk app for downtown Tulsa.

It computes building shadows from real OpenStreetMap footprints and NOAA-style solar position for any minute of any day, scores both sides of every downtown street block, finds shade windows, and routes shade-aware walks over the real OSM walking network. “Best time to walk” per block — including when both sides are shaded — is the differentiator for Tulsa heat.

Highlights

  • Continuous-time shade — a full-day time slider with date presets, instead of three hardcoded sun windows; sun altitude/azimuth shown live.
  • Side-of-street scoring — every block gets offset bands on both sides, sampled against the modeled shadows and colored sun-orange to shade-green.
  • Shade-aware routing — Dijkstra over the real OSM walking graph with Direct / Balanced / Vampire sun-aversion modes, plus sun-minutes and detour metrics.
  • Free and static — “Everything is free and static: Overpass-fetched OSM data, OpenFreeMap tiles, no keys, no backend storage.”
  • Honest about limits — “Side bands are synthetic offsets, not surveyed sidewalk geometry. Building shade only: no trees, awnings, terrain, or construction yet.”

How It’s Built

  • Frontend — Vite and React, with an imperative MapLibre controller that owns the map and shade model outside the React render loop.
  • Map engine — MapLibre GL with OpenFreeMap tiles and OSM-derived roads and building polygons.
  • Shade model — NOAA-style sun position for any minute of any date; each building casts a hull-swept ground shadow from its height; point-in-shadow tests use a grid index rebuilt per time tick.
  • Routing — Dijkstra over OSM walkable ways with experienced-length costs that weight sun exposure.
  • Mobile UI — a Vaul drawer with rest, half-open, and full-open states.
  • Hosting — Cloudflare Worker plus static assets; all shade math runs client-side as browser ES modules, also imported directly by node --test suites.

Screenshots

Tulsa Shadow Walk desktop map showing downtown Tulsa shade scores and route metrics
Desktop map workspace with route scoring, modeled building shadows, and side-of-street shade colors.
Tulsa Shadow Walk mobile route planning sheet over the map
Mobile map with the shade-aware route sheet and time controls.