Phasor Sums.

01Circles riding on circles

Watch a fairground ride whose cars spin on the ends of a turning arm. Each rider’s head draws a big, slow circle with small, fast loops wound around it.

The picture is far older than the fairground. For about fourteen centuries, from Ptolemy of Alexandria around 150 CE until Kepler replaced the circles by ellipses in 1609, astronomers described each planet as riding on a small circle, the epicycle, whose centre runs round a large circle, the deferent. Seen from the Earth, such a planet moves mostly one way against the stars, but now and then it stops, runs backwards for some weeks and turns forward again, just as Mars does. Each mismatch with the observations could be repaired with one more circle, which is why the scheme lasted so long.

A Spirograph does the same with gears. A toothed wheel rolls round inside a ring: its centre goes slowly round one way while the wheel turns quickly the other way about its centre, and the pen in one of its holes adds the two motions. Electrical engineers use the idea every day. The voltage at a European socket is the shadow of an arrow \(325\ \mathrm{V}\) long that turns fifty times a second; they call the arrow a phasor, and adding two alternating voltages means adding two such arrows tip to tail. The three phases of the mains are three equal arrows a third of a turn apart, and their sum is zero at every instant.

The figure above is this machine with as many arms as you add. Each circle card sets one arm: how long it is, how fast it turns and where it starts. The arms are joined tip to tail, and the tip of the last one, the pen, leaves the burgundy trail. The same mathematics run backwards takes any closed drawing apart into circles; that is Fig. 8.

02A turning arrow: Euler’s formula

Mark a point in the plane by the arrow that reaches it from the origin, and write the arrow as one number, \(z = x + iy\): \(x\) is how far it reaches to the right, \(y\) how far up, and the symbol \(i\) labels the upward direction. Adding two such numbers adds the arrows tip to tail, exactly as one adds two displacements or two forces.

Multiplying by \(i\) is a geometric act: it turns the arrow a quarter turn counter-clockwise. With the single rule \(i^2 = -1\),

and the arrow to \((-y, x)\) is the arrow to \((x, y)\) turned by \(90^\circ\). Two quarter turns make a half turn, which points the arrow backwards: that is all \(i^2 = -1\) says.

2.1The arrow that turns at a steady rate

Now let an arrow of length 1 move so that its velocity is always the arrow itself turned by a quarter turn,

where \(\theta\) plays the part of time. This is a stone whirled on a string: its velocity is always at right angles to the string, so it comes no closer and moves no further away (indeed \(\mathrm{d}|z|^2/\mathrm{d}\theta = 2\,\mathrm{Re}(\bar z\,iz) = 0\)), and its speed equals its distance from the centre, 1. After a time \(\theta\) it has travelled a distance \(\theta\) round the unit circle, which is an angle of \(\theta\) radians, so it sits at \(\cos\theta + i\sin\theta\) (Figure 1). On the other hand, a quantity whose rate of change is a fixed number \(k\) times itself is the exponential \(e^{k\theta}\), as a savings account that earns a fixed fraction per year grows exponentially. With \(k = i\) the two descriptions of the same motion must agree:

This is Euler’s formula. It packs a turn through the angle \(\theta\) into a single number and turns rotation into multiplication: \(e^{ia}\,e^{ib} = e^{i(a+b)}\), so multiplying any arrow by \(e^{ib}\) turns it by the angle \(b\).

2.2A check with power series★

Readers who know the series \(e^x = 1 + x + x^2/2! + x^3/3! + \dots\) can confirm (3) directly. Put \(x = i\theta\), use \(i^2 = -1\), \(i^3 = -i\), \(i^4 = 1\), and collect the real and the imaginary terms:

2.3Phasors

Let the angle grow steadily in time, \(\theta = \omega t + \varphi\), and stretch the arrow to a length \(A\):

This is a phasor. The radius \(A \ge 0\) is its length. The angular frequency \(\omega\), in \(\mathrm{rad/s}\), is how fast it turns, counter-clockwise for \(\omega > 0\) and clockwise for \(\omega < 0\); one turn takes \(2\pi/|\omega|\). The phase \(\varphi\) is its angle at \(t = 0\). Seen edge-on, the turning arrow is an oscillation: its shadow on the real axis, \(A\cos(\omega t + \varphi)\), moves back and forth like a mass on a spring. That is why a single phasor can stand for an alternating voltage, a sound wave or a swinging pendulum: the circle carries the oscillation, plus a copy a quarter period behind it in the imaginary part.

03The model: arms joined tip to tail

Mount a second arm on the tip of the first, a third on the tip of the second, and so on up to \(N\) arms. Mounting an arm on a moving tip means adding its arrow to the position of that tip, so the pen sits at

Each circle card on the page holds one triple \((A_k, \omega_k, \varphi_k)\): Radius \(A\) from 0 to 2, Angular frequency \(\omega\) from \(-32\) to \(32\ \mathrm{rad/s}\) and Phase \(\varphi\) from 0 to \(6.28\ \mathrm{rad}\), all in steps of 0.01. Lengths carry no unit, because the picture is scaled to fit (section 8): only their ratios matter. The Current formula box prints (6) with the stored numbers.

The partial sums \(z_k = \sum_{m \le k} A_m\,e^{i(\omega_m t + \varphi_m)}\) are the joints of the chain (Figure 2), and the pen is the last one, \(z = z_N\). Addition does not care about order, so swapping two cards changes the chain but not the pen: the curve depends only on the list of triples. Each arm’s angle is prescribed as \(\theta=\omega t+\varphi\). This constructs the curve geometrically; actual linked rods would exert forces and torques on one another, and would not generally maintain these independent rates. Everything on the screen is kinematics, geometry in motion, without forces.

3.1Velocity, and where the pen stops

Differentiating (6) term by term, with \(\mathrm{d}e^{i\omega t}/\mathrm{d}t = i\omega\,e^{i\omega t}\) from (2),

Each arm adds a velocity of size \(A_k|\omega_k|\) at right angles to itself. The pen stops, \(\dot z = 0\), only where these velocities cancel, so a stationary pen is possible there. It may form a cusp, a sharp point, but zero velocity alone is not enough: \(z=e^{it}+e^{-it}=2\cos t\) stops at its ends and smoothly retraces a straight segment. Two arm velocities can cancel only with equal tip speeds, \(A_1|\omega_1| = A_2|\omega_2|\), together with the moment at which the two velocities point in opposite directions, which, for distinct frequencies, comes round once each time the angle between the arms changes by \(2\pi\). The Trefoil preset is built this way: \(A = 1, 0.5\) and \(\omega = 1, -2\ \mathrm{rad/s}\), so both tip speeds are 1. The angle between its arms grows at \(|\omega_1 - \omega_2| = 3\ \mathrm{rad/s}\), and in each period of \(2\pi\ \mathrm{s}\) the pen stops three times, \(2\pi/3\ \mathrm{s}\) apart. The curve is the three-cusped deltoid, the one a Spirograph wheel draws with the pen on its rim when it rolls inside a ring three times its radius.

04Two arms: roses and beats

Two arms of equal length \(A\) already show both main behaviours. Take the phases zero for the moment, write \(\bar\omega = \tfrac12(\omega_1 + \omega_2)\) for the average rate and \(\Delta\omega = \omega_1 - \omega_2\) for the difference, and factor out the average rotation:

The last step is (3) used twice: \(e^{iu} + e^{-iu} = 2\cos u\). Read (8) as an arrow that turns at the average rate \(\bar\omega\) while its length \(2A\cos(\Delta\omega\,t/2)\) swells and shrinks at half the difference rate. Which of the two motions is the fast one decides what you see.

4.1Opposite directions: the rose

In polar coordinates the pen is at the angle \(\theta = \bar\omega t\) and the distance \(r = 2A\cos(\Delta\omega\,t/2)\) from the centre. Eliminating \(t\),

This is the rose, or rhodonea. For a whole number \(n\) it has \(n\) petals if \(n\) is odd and \(2n\) if \(n\) is even; a negative \(r\) is drawn on the opposite side of the centre, which is how an odd \(n\) manages with \(n\) petals. The three rose presets are built from (9). 3-petal rose has \(\omega = 4\) and \(-2\ \mathrm{rad/s}\), so \(\bar\omega = 1\), \(\Delta\omega = 6\) and \(n = 3\). 4-petal rose has \(\omega = 3, -1\), so \(n = 2\) and four petals. 8-petal rose has \(\omega = 5, -3\), so \(n = 4\) and eight petals. Their phases, \(-\pi/2\) and \(+\pi/2\), change the cosine in (8) into a sine, which only turns the rose by \(\pi/(2n)\) about the centre. The pen passes through the centre once for every petal.

4.2The same direction: beats

Now let both arms turn the same way at nearly the same rate. The Beating pair preset has \(A = 1.1\), \(\omega = 5\) and \(6\ \mathrm{rad/s}\), and phases \(0\) and \(0.1\ \mathrm{rad}\). Its arrow spins at \(\bar\omega = 5.5\ \mathrm{rad/s}\), once every \(1.14\ \mathrm{s}\), while its length, by (8) with the phases put back,

rises and falls once every \(2\pi/|\Delta\omega| = 6.28\ \mathrm{s}\). Figure 3 shows the shadow \(\mathrm{Re}\,z(t)\), which is what an oscilloscope would show, inside this envelope. Two tuning forks at \(440\) and \(442\ \mathrm{Hz}\) do the same with sound: the air pressure at your ear is the sum of two oscillations, and the loudness swells and dies twice a second, at the difference of the two frequencies. Musicians tune by slowing the beats until they vanish.

With unequal lengths the two arms and the line from the centre to the pen form a triangle, and the law of cosines gives

So \(|z|\) swings between \(|A_1 - A_2|\) and \(A_1 + A_2\), and it reaches zero only when the arms are equal. The Trefoil, with arms 1 and 0.5, stays between 0.5 and 1.5 from the centre.

05When the curve closes★

The pen returns to its start, and from then on retraces the same curve, if there is a time \(T\) with \(z(t + T) = z(t)\) for every \(t\). A common repeat time for all arms is obtained by requiring \(e^{i\omega_k T} = 1\) for every arm at once, so every \(\omega_k T\) must be a whole multiple of \(2\pi\). If all the frequencies are whole multiples of one largest common frequency \(g\), the shortest time that repeats every listed active arm is

This is a common period for the pen, but cancellation can shorten its true period. Combine equal-frequency complex amplitudes and remove any zero sums before seeking the pen’s shortest period. For example, \(e^{it}-e^{it}+e^{2it}=e^{2it}\) repeats after \(\pi\), although the listed frequencies give a common repeat time \(2\pi\). The readout uses the listed active arms.

where \(\gcd\) is the largest \(g\) for which every \(\omega_k/g\) is a whole number. The 3-petal rose has \(g = \gcd(4, 2) = 2\ \mathrm{rad/s}\) and closes after \(\pi\ \mathrm{s} = 3.14\ \mathrm{s}\); every other preset has \(g = 1\ \mathrm{rad/s}\) and closes after \(6.28\ \mathrm{s}\). If two frequencies have an irrational ratio, such as \(1\) and \(\sqrt2\ \mathrm{rad/s}\), no \(T\) exists: the curve never closes, and with two arms it passes, given time, as close as you like to every point of the ring between \(|A_1 - A_2|\) and \(A_1 + A_2\).

The sliders move in steps of \(0.01\ \mathrm{rad/s}\), so \(100\,\omega_k\) is a whole number and the page finds \(g\) exactly, with Euclid’s algorithm on these integers. Small changes can make the period long. Changing the second arm of the 3-petal rose from \(-2\) to \(-2.1\ \mathrm{rad/s}\) gives \(g = 0.1\ \mathrm{rad/s}\) and \(T = 62.83\ \mathrm{s}\); changing it to \(-2.01\) gives \(g = 0.01\ \mathrm{rad/s}\) and \(T = 628.32\ \mathrm{s}\). For two arms the number of petals in one period, the times \(|z|\) swings out and back, is \(|\omega_1 - \omega_2|/g\): 3 for the 3-petal rose, 61 for \(-2.1\).

5.1Rotational symmetry

Shift time by \(\tau\). Each term of (6) picks up its own factor \(e^{i\omega_k\tau}\):

If all these factors are equal, say to \(e^{i\beta}\), the shifted curve is the old one turned by the angle \(\beta\). They are equal when every difference \((\omega_j - \omega_k)\,\tau\) is a multiple of \(2\pi\), which first happens at \(\tau = 2\pi/M\) with \(M = \gcd(\omega_2 - \omega_1, \dots, \omega_N - \omega_1)\). The turn is then \(\beta = \omega_1\tau = 2\pi\,\omega_1/M\). Write \(\omega_1/M = p/q\) as a fraction in lowest terms: each shift turns the curve by \(2\pi p/q\), and since \(p\) and \(q\) share no factor, repeated shifts reach every multiple of \(2\pi/q\). The curve maps onto itself under these turns: it has \(q\)-fold symmetry, which the Symmetry readout shows.

Star has \(\omega = 1, -4, 6\ \mathrm{rad/s}\): the differences are \(-5\) and \(5\), so \(M = 5\) and \(\omega_1/M = 1/5\), five-fold. The 3-petal rose has \(M = 6\) and \(\omega_1/M = 4/6 = 2/3\), three-fold (Figure 4). The phases enter neither \(M\) nor \(q\): moving a Phase slider reshapes or turns the curve but leaves its symmetry alone.

06The average size of the curve

However tangled the curve, its average squared distance from the centre is simple. Write \(|z|^2 = z\bar z\), where \(\bar z\) is \(z\) reflected in the real axis, and multiply out the two sums of (6). The terms with the same arm twice give \(A_k^2\); each pair of different arms gives a cosine, as in (11):

Each cosine swings evenly about zero, so over one period, or over a long time, it averages to zero, provided its frequency \(\omega_j - \omega_k\) is not zero. Only the squares survive:

This is the readout \(\langle|z|^2\rangle = \Sigma A^2\) under the figure. In the language of waves it says that the power of a mixture of different frequencies is the sum of their separate powers. It is Parseval’s theorem, which Fig. 8 uses from the other side, to take a drawing apart into circles. For the Star, \(1^2 + 0.5^2 + 0.18^2 = 1.2824\), and by (14) \(|z|^2 = 1.2824 + 1.36\cos 5t + 0.18\cos 10t\) (Figure 5).

The condition in (15) matters. With two equal frequencies, as at the end of Exercise 4.1, the cross term in (14) does not oscillate at all. The readout still shows \(\sum A_k^2 = 2.42\), but the pen stays at \(|z| = 2.197\) from the centre, whose square is \(4.828\).

07How the page computes it

Because (6) gives the pen’s position at any time directly, nothing is integrated. Every frame the clock advances \(t\) by \(\Delta t \cdot s\), where \(\Delta t\) is the real time since the previous frame, capped at \(50\ \mathrm{ms}\) so that a tab coming back from the background does not jump, and \(s\) is the Speed slider, from 0 to 4, multiplied by a factor from the music when Auto Dance is on (section 8). The page then evaluates \(N\) cosines and \(N\) sines. No error builds up from frame to frame: every point drawn is the exact \(z(t)\) up to rounding, and the rounding of an angle \(\omega_k t\) stays below \(10^{-11}\ \mathrm{rad}\) even for \(\omega = 32\ \mathrm{rad/s}\) after \(1000\ \mathrm{s}\).

• Live trail: the pen position at the end of each frame, the newest Trail length of them (100 to 6000, default 2400, which is \(40\ \mathrm{s}\) at 60 frames per second). The trail joins them with straight segments. For the 3-petal rose at speed 1.00× and 60 frames per second the segments stray at most \(0.0007\) from the true curve, 0.035 % of its radius; at 4.00× speed, sixteen times more, \(0.011\).
• Final shape: the curve sampled at \(n + 1\) equally spaced times \(t_i = i\,T_\text{span}/n\), with 700 samples per \(2\pi\ \mathrm{s}\), clamped to between 1500 and 12 000. With Draw one full period on, the span is the period (12), but at most \(60\times 2\pi\ \mathrm{s} = 377\ \mathrm{s}\), so a period of \(628\ \mathrm{s}\) is drawn only in part; with it off, the span is the Span slider, 1 to 24, times \(2\pi\ \mathrm{s}\). Every preset gets \(n = 1500\).
• Period and symmetry: integer gcds of \(\mathrm{round}(100\,\omega_k)\) by Euclid’s algorithm, recomputed whenever a card changes. Circles with \(A = 0\) are left out, since they draw nothing.

7.1Morphing is a low-pass filter

When a slider moves while the Final shape view is open, the page computes the new exact samples \(q_i\) at once but draws points \(p_i\) that move, each frame, the fraction \(\alpha\) of the remaining way, with \(\alpha\) the Morph rate (0.02 to 0.35, default 0.08):

After \(m\) frames the gap has shrunk by \((1-\alpha)^m\). This is a first-order low-pass filter with a time constant of \(-1/\ln(1-\alpha)\) frames: 12.0 frames, \(0.20\ \mathrm{s}\) at 60 frames per second, for \(\alpha = 0.08\), and the gap falls below 1 % after 56 frames. The curves drawn in between are point-by-point blends of the old and the new curve, not curves that any set of phasors would draw. If the number of samples changes there is nothing to blend, and the new curve appears at once. With Smooth morphing off, \(\alpha = 1\) and every change is immediate.

08From the plane to pixels, and from sound to radii

The origin sits at the centre of the figure with the imaginary axis pointing up, so a point \(z = x + iy\) is drawn at the pixel \((c_x + s\,x,\ c_y - s\,y)\), with \((c_x, c_y)\) the centre of the canvas and the scale

Here \(w\) and \(h\) are the canvas size in CSS pixels and \(R\) is the farthest anything is drawn from the origin. In the Live view \(R\) is the larger of \(\sum_k A'_k\), the arm lengths as drawn, and the farthest point still on the trail. By the triangle inequality no joint and no circle edge lies further out than \(\sum_k A'_k\), so nothing leaves the figure. \(R\) grows at once when something would leave and shrinks back with a time constant of \(0.6\ \mathrm{s}\), so the picture neither spills over nor jitters. In the Final shape view \(R\) is the largest \(|z|\) on the curve as drawn. Zoom only zooms out, from \(1\times\) to \(0.3\times\). On a screen 1440 px wide the canvas measures \(770 \times 601\) CSS pixels, so the 3-petal rose, with \(R = 2\), is drawn at \(132\) pixels per unit and the trail’s straight segments miss the curve by \(0.09\ \mathrm{px}\) at speed 1.00× and \(1.5\ \mathrm{px}\) at 4.00×. On a phone 390 px wide the canvas is \(356 \times 356\) px.

The traced curve is burgundy and 1.8 px wide. In the Live view it is drawn in twelve pieces whose opacity rises from 0.25 for the oldest to 1 for the newest, so the trail fades behind the pen. Each arm, with the 3 px dot at its tip, has the colour of the swatch on its circle card; each arm’s circle is a thin rose line around the joint it turns about; the pen is a burgundy dot of radius 5.5 px. The Final shape view draws the sampled curve as a 1.8 px burgundy line over a 6 px pale-rose band. Two thin lines through the centre are the real and imaginary axes.

8.1Auto Dance: sound into radii

An audio file you choose stays in your browser and is played through the Web Audio analyser. Its fast Fourier transform of 2048 samples gives 1024 frequency bins, each \(21.5\ \mathrm{Hz}\) wide at a sampling rate of \(44.1\ \mathrm{kHz}\). The analyser does the opposite of this page: it takes a sound and finds the phasors in it. It reports each bin on a decibel scale and smooths it over time with a constant of 0.8. The page averages the bins in three bands, bass \(20\)–\(150\ \mathrm{Hz}\) (bins 1 to 7 at \(44.1\ \mathrm{kHz}\)), mid \(150\)–\(4000\ \mathrm{Hz}\) and high \(4\)–\(16\ \mathrm{kHz}\), divides by 255 so that each level lies between 0 and 1, and smooths each level once more per frame, \(e \leftarrow e + 0.15\,(e_\text{raw} - e)\).

• Arms whose \(|\omega|\) is at or below the median of all the \(|\omega_k|\) breathe with the bass: \(A' = A\,\big[1 + \mathrm{ease}(\text{bass})\, d_\text{bass}\,(1 - 0.7\,|\omega|/|\omega|_\text{max})\big]\), where ease is the Bounce curve chosen on the card and \(d_\text{bass}\) the Bass drive. Slow arms swing most.
• Faster arms follow the treble: \(A' = A\,(1 + \text{high}\cdot d_\text{high})\), with \(d_\text{high}\) the High drive.
• The mid band speeds up time: \(\Delta t\) is multiplied by \(1 + \text{mid}\cdot d_\text{speed}\), with \(d_\text{speed}\) the Speed drive.
• A beat is declared when the raw bass level is more than 35 % above the previous frame’s, exceeds 0.22, and at least \(280\ \mathrm{ms}\) have passed since the last beat. All radii are then multiplied by \(1 + d_\text{burst}\), with \(d_\text{burst}\) the Beat burst, falling back linearly to 1 over 10 frames. The tempo shown is \(60\,000\) divided by the median of the last 8 intervals between beats in milliseconds.

The music rescales only copies \(A'_k\) of the radii: the stored \(A_k\), \(\omega_k\) and \(\varphi_k\) are never changed, so switching Auto Dance off returns the exact curve. Record stores the whole list every \(50\ \mathrm{ms}\) against the audio time, and Replay eases toward each stored list over \(50\ \mathrm{ms}\).

09What the model leaves out

• It is pure kinematics: the arms have no mass and exert no forces on each other. For a chain of arms that does push and pull, see the double pendulum, Fig. 2.
• Circles on circles can describe any closed orbit, as Fig. 8 shows, but they do not explain one. Ptolemy’s epicycles reproduced where the planets appear without the law of gravity that puts them there; Kepler’s ellipses and Newton’s gravity need far fewer numbers.
• The period readout assumes that every \(\omega\) is a whole multiple of \(0.01\ \mathrm{rad/s}\), which the sliders guarantee. Truly incommensurate frequencies never close, but a screen can only ever show finitely many points of such a curve.
• When every active circle has the same \(\omega\), the curve is a single circle, and the Symmetry readout shows 0-fold: with no difference of frequencies to take a gcd of, the code writes 0, although a circle is in fact mapped onto itself by every turn.
• The beat detector is a threshold rule, not a tempo tracker: it misses soft beats and can count a busy bass line twice.
• The band levels are smoothed per frame, so on a \(120\ \mathrm{Hz}\) screen the meters respond twice as fast as on a \(60\ \mathrm{Hz}\) screen.
• While Auto Dance is on, the radii change during the drawing, so the live trail is no longer one closed curve.

9.1Further reading

1. R. P. Feynman, R. B. Leighton and M. Sands, The Feynman Lectures on Physics, Vol. I, Addison-Wesley, 1963: chapters 22 (Algebra, which ends with Euler’s formula) and 48 (Beats).
2. T. Needham, Visual Complex Analysis, Oxford University Press, 1997: chapter 1 (geometry and complex arithmetic, with Euler’s formula as rotation).
3. E. Hecht, Optics, 5th edition, Pearson, 2017: chapter 7 (the superposition of waves: adding phasors, and beats).
4. T. S. Kuhn, The Copernican Revolution, Harvard University Press, 1957: chapter 2 (the problem of the planets: deferents and epicycles).