Fourier Series Visualizer Back
Signal Processing & Math

Fourier Series Visualizer

Synthesize square, sawtooth, and triangle waves from rotating phasors. Watch real-time as adding harmonics approximates the target waveform. Experience the Gibbs phenomenon.

Waveform
Parameters
Harmonics N 7
Animation Speed 1.0×
Display
7
Harmonics used
f₁
Fundamental freq.
Max amplitude
Approx. error

Formula Reference

Square wave:

$$x(t) = \frac{4}{\pi}\sum_{n=1,3,5,...}^{}\frac{\sin(n\omega t)}{n}$$

Odd harmonics only. Gibbs overshoot ≈ 9% at jumps.

Phasor Animation + Synthesized Waveform
Frequency Spectrum (Harmonic Amplitudes)

What is a Fourier Series?

🧑‍🎓
What exactly is a Fourier series? I see the simulator is drawing a square wave from a bunch of spinning circles.
🎓
Basically, it's a way to build any repeating wave—like a square or triangle wave—from a sum of simple sine waves. Each spinning circle you see is a "harmonic," a sine wave with a specific frequency. Try moving the "Harmonics N" slider above from 1 to 5. See how adding more circles makes the red line look more like a perfect square?
🧑‍🎓
Wait, really? So any weird, jagged signal can be made from smooth sine waves? Why does the square wave formula only use odd numbers (1, 3, 5...)?
🎓
Great observation! That's a symmetry property. A perfect square wave is "odd symmetric," meaning it flips perfectly around the center. Even-numbered sine waves don't have that symmetry, so they cancel out. In practice, this means we only need half the terms to build it. Switch the wave type to "sawtooth" in the simulator—you'll see it uses *all* integers, which changes the sound and look completely.
🧑‍🎓
Okay, I see the wiggly overshoot near the square wave's edges, even with many circles. What's that called, and does it ever go away?
🎓
That's the Gibbs phenomenon! It's a classic result: when you try to approximate a jump (like the square wave's instant rise) with a finite sum of smooth sines, you get about a 9% overshoot that *never* fully disappears, no matter how many terms you add. Crank the "Harmonics N" slider to the max and slow the "Animation Speed." You'll see the overshoot persist, just in a narrower spike. It's a fundamental limit of Fourier approximation.

Physical Model & Key Equations

The core idea is representing a periodic function $x(t)$ with period $T$ as an infinite sum of sine and cosine waves. The general Fourier series expansion is:

$$x(t) = a_0 + \sum_{n=1}^{\infty}\left[ a_n \cos(n \omega t) + b_n \sin(n \omega t) \right]$$

Here, $\omega = 2\pi / T$ is the fundamental angular frequency. The coefficients $a_n$ and $b_n$ are calculated from the original wave's shape, determining the amplitude of each harmonic. For symmetric waves, many coefficients become zero, simplifying the series.

For the square wave shown in the simulator, the symmetry forces all $a_n$ and even $b_n$ terms to zero. The remaining series, using only odd sine terms, is:

$$x_{\text{square}}(t) = \frac{4}{\pi}\sum_{k=0}^{\infty}\frac{\sin\big((2k+1)\omega t\big)}{2k+1}$$

In this formula, $k$ is an integer starting at 0, so $(2k+1)$ generates the odd harmonics: 1, 3, 5,... The factor $4/\pi$ scales the sum to match the square wave's amplitude. Each term $\frac{\sin(n\omega t)}{n}$ represents a spinning phasor (circle) in the visualization, with its radius shrinking as $1/n$.

Real-World Applications

Audio Synthesis & Music: Fourier series are the foundation of subtractive synthesis in electronic music. A synthesizer starts with a rich wave (like a sawtooth, full of harmonics) and uses filters to remove frequencies, shaping the final sound. The different harmonic content is why a square wave sounds "hollow" and a sawtooth sounds "buzzy."

Signal Processing & Compression: JPEG image compression and MP3 audio compression rely heavily on Fourier-type transforms. They break down complex signals (an image's rows of pixels, a song's audio waveform) into frequency components, then discard the least perceptible ones to dramatically reduce file size.

Electrical Engineering & Power Systems: Modern electronic devices (like computers) draw non-sinusoidal current from the wall, creating harmonic distortion on the power grid. Engineers use Fourier analysis to measure these harmonics and design filters to prevent equipment damage and inefficiency.

Medical Imaging (MRI): Magnetic Resonance Imaging machines don't take a direct picture. They measure the Fourier components of spin signals from hydrogen atoms in your body. A computer then performs an inverse Fourier transform to reconstruct the detailed cross-sectional image you see.

Common Misconceptions and Points to Note

When you start using this tool, there are a few points that are easy to misunderstand, so be careful. First, you might think "if you make the number of harmonics N infinite, you get a perfect waveform". However, for waveforms with sharp discontinuities like a square wave, the Gibbs phenomenon leaves an overshoot of about 9%. This is mathematically inescapable; it doesn't change whether N=100 or N=1000. In practical work, you need to design with this "cannot be perfectly reproduced" characteristic in mind.

Next, don't confuse the relationship between the "fundamental frequency" and the "waveform period". For example, if the fundamental frequency $f_1$ is 50Hz, its period $T_1$ is $1/50 = 0.02$ seconds, right? However, the period of the synthesized square wave also becomes 0.02 seconds. In the time of one fundamental period, the synthesized waveform also completes one cycle. Try moving the "Fundamental Frequency" slider in the tool to see how the phasor rotation speed and the waveform repetition speed change in sync.

Finally, as a practical pitfall, there is "truncation error". Because you truncate an infinite series at a finite N, error inevitably occurs. For instance, a square wave with N=9 is a state where terms from n=17 onward in the theoretical formula $$x_{\text{square}}(t) = \frac{4}{\pi}\sum_{n=1,3,5,...}^{\infty}\frac{\sin(n\omega t)}{n}$$ are ignored. This error converges quickly and is small for smooth waves like triangle waves, but tends to remain as oscillation (ringing) for square waves. In practical signal processing, you decide N by considering the trade-off between required accuracy and computational cost.

Related Engineering Fields

The concept of Fourier series is the very "decomposition and synthesis" paradigm underlying various engineering fields, including CAE. For example, in structural vibration analysis, complex periodic vibrations from engines or blades are decomposed into frequency components using Fourier series. This allows you to identify issues like "resonance is occurring at a specific rotational speed (e.g., 4 times the fundamental frequency)" and leads to design changes.

It's an essential concept in electromagnetics and wireless communications. The spectrum of a modulated signal is analyzed using Fourier series (or more generally, Fourier transform) to determine bandwidth or evaluate interference (EMI) to other systems from unwanted harmonics. If you display a sawtooth wave in the tool, you'll see it contains all integer-order harmonics, right? This directly relates to switching power supply noise analysis. Many harmonic noises are generated from square waves switching ON/OFF at high speeds, making filter design crucial.

Furthermore, in acoustics and audio engineering, it's not an exaggeration to say that the differences in musical timbre or vowel sounds are determined by the intensity ratio of harmonics to the fundamental (spectral envelope). Synthesizers are a direct application of this very tool, creating sounds by combining square and triangle waves. Even as a CAE engineer, you'll often need this perspective when simulating product operating sounds or considering noise reduction measures.

For Further Learning

Once you're comfortable with this tool, the recommended next step is learning about the "Fourier Transform". While Fourier series deals with "periodic signals," the Fourier transform is an extended version that can also handle "non-periodic signals." The basic idea is the same "superposition of waves," so if you have a solid grasp of the phasor imagery here, understanding it becomes much easier.

If you want to delve a bit deeper into the mathematical background, look into the concept of "orthogonal function systems". It is precisely because sine and cosine waves are "orthogonal" to each other that the coefficients $a_n$, $b_n$ can be determined independently. This is exactly the same idea as how any vector in 3D space can be uniquely represented as $(a, b, c)$ because the x, y, z axes are orthogonal.

For practical learning, try analyzing experimental data using an FFT (Fast Fourier Transform) analyzer. When you decompose a waveform measured with an actual vibration sensor or oscilloscope into frequency components using the FFT function, you can experience firsthand how "theory" connects to "actual measurement." Start by measuring a simple sine wave, then measure a square wave to confirm if odd-order harmonics appear as theory predicts. Doing so will help you realize that what this visualization tool shows is directly applicable in the real world of engineering.