Fractals - Lorenz Attractor

Drag to rotate · scroll or pinch to zoom

σ
ρ
β
Points
dt

Algorithm

The Lorenz attractor comes from a 1963 simplified model of atmospheric convection: three coupled ordinary differential equations relating a state (x, y, z) through three parameters σ, ρ, β:

dx/dt = σ(y−x)    dy/dt = x(ρ−z)−y    dz/dt = xy−βz

The classic values σ = 10, ρ = 28, β = 8/3 produce the iconic butterfly-shaped strange attractor: the trajectory never settles to a point or a repeating cycle, never crosses itself, and never leaves a bounded region — it spirals around one wing, unpredictably kicks over to the other, and repeats forever without exact repetition. Two trajectories starting a hair's breadth apart diverge exponentially, the sensitive dependence on initial conditions that gave chaos theory its "butterfly effect" name (Lorenz's own 1972 talk title). The attractor itself is a fractal: it has a non-integer dimension of roughly 2.06 — more than a surface, less than a solid.

Below ρ ≈ 24.74 (with σ = 10, β = 8/3) the chaos vanishes: trajectories spiral down to one of two stable fixed points instead. Try dragging ρ below that threshold to watch the butterfly collapse into a simple spiral.

The trajectory is integrated with fourth-order Runge–Kutta and rendered by the same point-cloud renderer built for the 3D IFS page — a dense point sequence along the curve, projected and density-shaded exactly like that chaos-game point cloud.

Color by time tints the trajectory by how far along the sequence each point falls, split into 256 evenly sized chunks along d3's Turbo gradient (near-black at the very start, through blue, green, and yellow, to dark red at the end). Unlike IFS's coloring, which tints by which of a handful of transformations produced a point — where a cyclical rainbow palette is fine, since there's no inherent order to "which vertex" — time has a direction, so a plain hue wheel would make the beginning and end look like the same color. The sequential gradient makes the spiral-and-switch motion visible all at once: each wing's loops fan out through the gradient, and a visible color jump marks exactly where the trajectory kicks over to the other wing.

Page Creation

The whole page was created with Claude Code. These were the most significant prompts that shaped this page:

  1. Create a new fractal page for the Lorenz Attractor, reusing the 3D point-cloud renderer built for IFS 3D.
  2. Add a "Color by time" checkbox, bucketing the trajectory into 24 chunks by iteration index and coloring each with its own hue via PointCloudRenderer3D's categorical coloring.
  3. The cyclical hue-wheel palette makes the start and end of the trajectory look the same color — switch to a sequential ColorBrewer gradient (d3's interpolateYlGnBu) just for this page's time buckets.
  4. The gradient's pale-yellow start is nearly invisible on the white canvas background — sample from further along the gradient instead of from its actual start.
  5. Sample the gradient through d3.easygraph.colorScale('Sequential.YlGnBu', ...) instead of d3's own interpolateYlGnBu directly, resolving the scheme by the same name EasyGraph's Colors section lists it under.
  6. Try d3.interpolateTurbo instead of YlGnBu, sampled over its full range with no low-end offset — Turbo's low end is dark, not pale, so it doesn't wash out against the canvas the way YlGnBu's did.
  7. Generalize d3.easygraph.colorScale()/resolvePalette() to resolve interpolator-only schemes like Turbo by name too (Sequential.Turbo), the same way it already resolves ColorBrewer's classed schemes, and switch this page to call that instead of sampling d3.interpolateTurbo directly.
  8. Raise the time-bucket count from 24 to 256 for a smoother gradient — the trajectory's per-point category array is a Uint8Array, so 256 is the most this can go without changing its type.