Eddies stir green diatom and turquoise coccolith blooms, like ocean-color imagery.
Four fields share a grid: nutrients, fast-growing diatoms, slower coccolithophores that win once nutrients run low, and zooplankton that graze both with a sigmoidal appetite and a taste for diatoms. Coastal winds push surface water offshore and upwell deep nutrients, so green diatom blooms hug the coast and age into milky turquoise coccolith swirls as they drift out to sea. The current is the curl of a stream function built from drifting Gaussian eddies, a meandering jet and weak small-scale stirring, masked so the coastline is a streamline. Fields are advected semi-Lagrangian with a MacCormack correction on the plankton to keep filaments sharp, then shown as true-color water or as a log-scale chlorophyll map.
Try it. Drag to paint nutrients and watch a bloom grow and smear along the currents. Choose Spin eddy (or right-drag) and press and drag to steer a new whirlpool through the water. Raise or lower the upwelling wind, switch to the chlorophyll view with the button or V, and press R for a fresh ocean.
Paste this into Claude Code, Codex or any coding agent to get a simple version running, then take it wherever you like.
Build an ocean plankton bloom simulation that looks like satellite ocean-color imagery, 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, stays sharp on high-DPI screens, and resizes with the window.
- Create a grid about 300 by 200 cells with three fields: nutrients N, phytoplankton P and zooplankton Z.
- Build a current from a stream function: the sum of a dozen Gaussian bumps (eddies) of random size and sign that drift slowly. The velocity is the curl of the stream function (u = d(psi)/dy, v = -d(psi)/dx), which is automatically divergence free.
- Each frame, advect all three fields semi-Lagrangian (trace each cell backward along the velocity, sample with bilinear interpolation), then update the biology: P grows on N with a Michaelis-Menten term, Z grazes on P, and some of what dies returns to N.
- Add nutrients along one edge (an upwelling coast) so blooms keep starting there.
- Color each cell from deep blue (clear water) toward green as P rises, and draw the grid scaled up with smoothing.
Once that works, make it beautiful:
- Split phytoplankton into fast diatoms (green) and slower coccolithophores that do well at low nutrients and turn the water milky turquoise.
- Add a MacCormack correction to the plankton advection so filaments stay sharp.
- Draw a land mass along the coast and make the coastline a streamline by multiplying the stream function by a ramp that is zero at the shore.
- Let the mouse paint nutrients.
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 a log-scale chlorophyll false-color view, draggable eddies, or offshore Ekman transport that carries coastal blooms out to sea.
