Lissajous

What

リサージュ曲線の変形版です。
少しずつx座標が変化するので、最終的に虹のような図形になります。

How


var R = 150;
var a = 3;
var b = 4;
var d = 1;
var u = 0.003;
function setup() {
  createCanvas(400, 400);
  background(0);
  colorMode(HSB, 250);
  d = PI / 6;
} 

function draw() {
  noStroke();
  push();
  translate(170,200);
  var t = frameCount * u;
  var s = (frameCount - 1) * u;
  var preX = R * sin(a * s + d)* sin(a * s + d)* cos(b * s + d) + frameCount*0.001;
  var preY = R * sin(b * s) * sin(a * s);
  var x = R * sin(a * t + d)* sin(a * t + d)* cos(b * t + d) + frameCount*0.001;
  var y = R * sin(b * t) * sin(a * t);
  stroke(color((frameCount/10) % 250, 200, 250));
  line(preX,preY,x,y);
  pop()
}