* Uses a nested loop to draw a series of sine waves

*/

​

var numPoints = 20;

var numLines = 5;

var minHue = 225;

var maxHue = 300;

​

var waveHeight = 50;        // each indiv wave

var totalWavesHeight = 300; // all the waves total

var wavePeak;

var waveValley;

​

​

function setup() {

  createCanvas(600, 600);

  colorMode(HSB, 360, 100, 100);

  background(0,0,0);

  noStroke();

  wavePeak = (height - totalWavesHeight)/2

  waveValley = wavePeak + waveHeight;

}

​

function draw() {

  background(0,0,0);

  strokeWeight(10);

  noFill();

​

  let pointGap = width/numPoints;                 // How far apart should points be

  let lineGap = totalWavesHeight/numLines;        // How far apart should lines be

​

  for(let j = 0; j < numLines; j++){              // Loop through the lines

    let h = map(j, 0, numLines, minHue, maxHue);  // Hue depends on line

    stroke(h, 70, 100);

    beginShape();

    for(let i = 0; i < numPoints; i+=0.1){        // Loop through every point in the line

      let x = (i)*pointGap;                       // x values just go from left to right

      let y = map(sin(i), -1, 1, wavePeak, waveValley);   // y values oscillate using sin

      vertex(x, y + (j * lineGap));               // y adjusted depending on the line

    }

    endShape();

  }

​

  noLoop();

}

​