Sahyun's Physics Applets in HTML5

HTML 5

Adding Sine to Cosine varying the phase.

Adding Two Sinusoidal Waves

Wave 1: Sine Wave (solid blue): y = sin(x + phase)
Wave 2: Cosine Wave (dashed red): y = cos(x)
Sum = Wave 1 + Wave 2 (thick black) = sin(x + phase) + cos(x)

Activity:

Adjust the phase of the sin graph using the slider.

Questions:

  1. What phase is needed to match the sine graph with the cos graph? What happens to the sum in this case?
  2. What phase angle is needed to make the sin graph the inverse of the cos graph? What happens to the sum in this case?
  3. If you were to add a phase for the cos graph, what phase angle would be needed to match the sin graph when the sin graph's phase angle is 0?

The circle in the bottom right represents the phase on a unit circle.

This applet was developed by Steven Sahyun. The initial graph was created in MATLAB and the code was converted and extended to HTML5/JavaScript with assistance from OpenAI’s ChatGPT (Jan. 30, 2026).