let angle = 0;

let frequency = 440; 

let amplitude = 0.5; 

let wavePoints = []; // Array to store wave points

let scrollSpeed = 0.1; // Speed of auto-scroll

​

function setup() {

  createCanvas(400, 200);

  osc = new p5.Oscillator('sine');

  osc.start();

  osc.amp(amplitude);

  osc.freq(frequency);

}

​

function draw() {

  background(220);

  stroke(0);

  fill(128);

  noFill();

  wavePoints = []; // Clear wavePoints array for each frame

​

  // Generate multiple sine wave points

  for (let x = 0; x < width; x++) {

    let angleX = map(x, 0, width, angle, angle + TWO_PI); // Adjust angle based on x

    let y = map(sin(angleX), -1, 1, -amplitude * height, amplitude * height);

    wavePoints.push(y);

  }

​

  // Draw line segments connecting wave points

  beginShape();

  for (let x = 0; x < width; x++) {

    vertex(x, wavePoints[x] + height / 2);

  }

  endShape();

​

  // Update angle for next frame with auto-scroll

  angle += scrollSpeed;

  angle %= TWO_PI; // Wrap angle to prevent exceeding range

}