A fire runs uphill and downwind across a topographic incident map, trailing smoke.
Hillshaded terrain is covered in grass, shrub and timber, chosen from elevation, slope aspect and moisture. Each burning cell pushes ignition into its neighbours in 16 directions at a Rothermel-style rate: a no-wind rate for the fuel, damped by moisture and multiplied by one plus a wind factor that grows with wind speed toward the downwind side and a slope factor that grows with the square of the uphill slope. Shrub and timber loft embers that start spot fires, roads and dozer lines stop the flame front but not the embers, and the smoke is a density field carried by the wind and drawn with its own shadow. Burned ground is banded by half-hour progression lines, like a real incident map.
Try it. Drag to cut a dozer line. Click to call in a water drop. Drag the compass or use the arrow keys to turn the wind and change its speed. F starts a fire under the pointer, Space adds a lightning strike and R starts over.
Paste this into Claude Code, Codex or any coding agent to get a simple version running, then take it wherever you like.
Build a wildfire spread simulation with JavaScript and the HTML canvas element. Put everything in a single index.html file with no libraries or build step, so I can open it directly in a browser.
Start simple:
- Make a canvas that fills the window and stays sharp on high-DPI screens. Use a 200 by 125 grid of cells, each 30 metres across.
- Write a small 2D noise function and use it to make a height map, then give each cell a fuel type: grass in low, dry places, shrub in between and timber on moist slopes.
- Each cell is unburned, burning or burned. Start a fire in one cell.
- Every step, each burning cell adds ignition progress to its 8 neighbours at a rate R / distance, where R = R0(fuel) * (1 + windFactor + slopeFactor). Use windFactor = 0.3 * windSpeed^1.5 * (the cosine of the angle between the spread direction and the wind, if positive) squared, and slopeFactor = 5.3 * tan(uphill slope)^2. A neighbour ignites when its progress reaches 1. A cell burns for a few minutes (longer for timber), then becomes burned.
- Draw the map in fuel colours, burning cells in bright orange and burned cells in dark brown.
Once that works, make it beautiful:
- Add hillshading and contour lines so it reads like a topographic map, and draw the fire's perimeter as a red line.
- Glow the flames by drawing the burning cells into a small canvas and scaling it up with smoothing, using additive blending.
- Add a smoke field: burning cells add density, which moves with the wind each frame and spreads a little. Draw it as soft grey on top.
- Let me drag to cut firebreaks and click to soak an area with water.
Explain the key ideas in short code comments. When you're done, tell me how to open it and suggest three directions I could take it next, such as spot fires from embers, 16 spread directions for rounder fire shapes, or progression bands showing where the fire was each hour.
