	Amplitudes	Frequencies	Phases
Signal 1
Signal 2
Signal 3

About this app

Sum of sines viewer

This app gives you an opportunity to play around with superimposed sine waves. You can control the amplitudes, frequencies, and phases, as well as the sampling rate.

About the parameters:

There are three sine waves, colored orange, green, and blue, with their sum shown in heavier black. (Colors are chosen to be visually distinct in the presence of protanopia, deuteranopia, and tritanopia. They are indistinct in the presence of achromatopsia.)
The display’ s x goes from 0 to 1.
Each of the three sine waves is A sin(2 π (ω x - φ)).
- A: You can vary the amplitude A from 0 to 1.
- ω: You can vary the cycle frequency ω from 0 to 20. Since this app includes the factor 2 π, frequency ω=3 means there are three cycles visible in the display.
- φ: You can vary the phase shift φ from 0 to 1. Since this app includes the factor 2 π, phase shift φ=0.25 means a shift to the right by a quarter of a cycle.
Since there are three sine waves, and since the maximum amplitude for each is 1, the display’s y goes from -3 to 3.
The sample count is how many values of x are plotted. There are two controls for this: the slider makes it easy to swing the sample-count widely, all the way from lowest to highest. The text box (with up-arrow and down-arrow) makes it easy to adjust the sample count by just a little bit.

Software components:

The JavaScript source code for this app is available on GitHub.
To draw the graph, this app uses the d3.js JavaScript library.
To manage the buttons, sliders, and so on this app uses the Sliver JavaScript library.

	These tabs have some presets you can play with.
	The orange, green, and blue add up to make the black. As the orange has the most amplitude, with lowest frequency, the green and blue appear as ripples on top of the main wave. This is the default demo when you load this page; you can play with any of the controls as you wish.
	This is another combination of three sines.

	The sum of two sines with the same frequency is another sine — even if the phases are different. This is how noise-cancelling headphones work: they try to imitate the surrounding sounds, 180 degrees (half a cycle) out of phase. If you slide Signal 2’s phase closer to 0.0 — or 1.0 — you'll see how these signals can reinforce one another, rather than cancelling out.
	This is also the sum of two sines, with phase closer to the same. Here the two don’t cancel each other out, but rather, they reinforce one another.
	The sum of two sines with different frequencies isn’t another sine — rather, you get an outer envelope involving the different in frequencies. That annoying yoing-yoing-yoing when you hear two instruments playing almost the same pitch, just out of tune, are called beats.

This is a selector for a single sine wave.

	For me, this part is the most fun! The other demos show examples of varying amplitude, frequency, and phase. Here we look into what can get weird, even for something as seemingly simple as a single sine wave.
	Click here to show a single sine wave with highest sampling: 1000 data points. The frequency is 10 and you can see 10 peaks of the sine wave.
	Click here to show that same single sine wave, but sampled at 500 data points. You can still see 10 peaks of the sine wave.
	Click here to show that same single sine wave sampled at 100 data points. You can still see 10 peaks of the sine wave but it’s getting grainy.
	Click here to show that same single sine wave sampled at 40 data points. It’s really grainy but you can still see the peaks and the troughs. What happens if you vary Signal 1’s phase?
	Click here to show that same single sine wave sampled at 20 data points. What happened?!? Try varying Signal 1’s phase.
	With sampling at 20 data points, it looks like there are two waves, each with two peaks.
	With sampling at 17 data points, it looks like there are two waves, each with three peaks.
	You can read more about this in the Wikipedia articles on aliasing and the Nyquist-Shannon sampling theorem.