simple animation 3

// variable to keep track of "time-like" parameter

var t = 0;

​

function setup() {

  createCanvas(800, 600);

  noStroke();

}

​

function draw() {

  // blank canvas for each frame

  background('white');

  // draw several balls

  for (var i = 0; i < 10; i += 1) {

    // calculate coordinates of ball

    var x = 200 * cos(5 * (t + 2*i)/100);

    var y = 200 * sin(4 * (t + 2*i)/100);

​

    // draw ball

    fill(255, 0, 0, i*25);

    ellipse(400+x, 300-y, 20);

  }

  // update parameter

  t = t + 1;

  // border

  stroke(0); noFill(); rect(0,0, width-1, height-1);noStroke();

}