Two Fourier series, one pen
Give it a silhouette and two chains of spinning circles redraw the outline. The blue chain sets x, the gold chain sets y, and the pen sits where their dashed guides cross. Under the stage are the exact equations it is running, ready to copy.
Octopus with N = 1 circles per axis. t runs from 0 to 2π once around the outline. Units: 1 = 1% of the outline's height, with the origin at its center.
Each pair of terms is one circle: radius √(ak² + bk²), turning k times per lap.
Copies the current N. The Desmos version uses Desmos's default range of 0 ≤ t ≤ 1, so each term reads cos(2πkt): paste it into a new expression and the outline appears.
One row per circle, k = 1 to N. a, b drive the x chain; c, d drive the y chain.
| k | ak | bk | ck | dk |
|---|
The same five steps run on every image, in your browser, in a few milliseconds.
The image becomes a grid of brightness values, or transparency values for a PNG with a clear background. Otsu's method picks the threshold that best splits the pixels into two groups, and whichever group touches the image border counts as background. Marching squares then traces the line where the image crosses that threshold, to a fraction of a pixel. If it finds several closed loops, it keeps the one that encloses the most area.
The loop is resampled into M = 1,024 points spaced evenly along its length, starting at the top of the shape. Walking those points in order is the parameter t: 0 at the start, 2π after one lap. The shape is centered on its average point and scaled so its height is 100 units.
Track only your left–right position as you walk and you get a signal x(t) that repeats every lap. Track only your height and you get y(t). Each is an ordinary periodic function, so each has its own Fourier series.
For every k from 1 to 255, a sum over the samples gives each coefficient:
bk uses sin in place of cos, and ck, dk are the same two sums taken over the y samples. This is the discrete form of ak = (1/π)∫ x(t) cos kt dt. Centering the shape makes the constant terms zero, which is why the series start at k = 1.
The right side is the horizontal position of a point riding a circle of radius rk that turns k times per lap, starting at angle φk. Stack the circles tip to tail and the horizontal position of the last tip is xN(t). The gold chain does the same for y, turned a quarter turn so its vertical position is the one that counts. The pen sits where the two dashed guides cross.
Smooth outlines have coefficients that shrink quickly, so a few circles get close. The heart curve is the extreme case: its formula, x = 16 sin³t and y = 13 cos t − 5 cos 2t − 2 cos 3t − cos 4t, already is a Fourier series with four harmonics, so N = 4 draws it exactly. (That preset keeps its own t instead of being resampled by length, which would mix in higher harmonics.)
A sharp corner makes the coefficients shrink only like 1/k², so the worst-case error falls roughly like 1/N: doubling the circles about halves the error. The Moore curve packs 256 corners in at every scale, so it stays visibly off until N is in the hundreds.
The error chart shows which kind of shape you have. On its log scales a steep line means the series closes in fast, and a shallow one means corners.
Many epicycle animations use a single chain with complex coefficients, z(t) = Σ ck eikt. This page uses two real chains, one per coordinate. They carry the same information, split differently.