let dsizes1 = [];

let sizes1 = [];

let angle1 = 0;

​

let circles2 = [];

let dsizes2 = [];

let sizes2 = [];

let angle2 = 90;

​

let n = 4; 

let r = 150;

let speed = 0.4;

​

function setup() {

  createCanvas(400, 400);

  angleMode(DEGREES);

  for (let i=0; i<n; i++){

    let loc = angle1+360/n;

    circles1[i] = createVector(width/2 + r*cos(i*loc), height/2 + r*sin(i*loc));

    sizes1[i] = floor(((i+3)*0.2)*50); 

    dsizes1[i] = 1; 

  }

  for (let i=0; i<n; i++){

    let loc = angle2+360/n;

    circles2[i] = createVector(width/2 + r*cos(i*loc), height/2 + r*sin(i*loc));

    sizes2[i] = floor(((i+3)*0.2)*50); 

    dsizes2[i] = 1; 

  }

}

​

function draw() {

  background(0, 10);

  // ellipse(width/2, height/2, r*2, r*2);

  stroke(255, 200);

  noFill();

  // Set 1

  for (let i=0; i<n; i++){

    loc = 180/n;

    circles1[i].x = width/2 + r*cos(angle1+i*loc);

    circles1[i].y = height/2 + r*sin(angle1+i*loc);

    ellipse(circles1[i].x, circles1[i].y, sizes1[i], sizes1[i]);

​

  }

  for (let i=0; i<n; i++){

    if (sizes1[i] >= 100 || sizes1[i] <= 10){

      dsizes1[i] = dsizes1[i]*-1; 

    }

    sizes1[i] = sizes1[i] + dsizes1[i];

  }

​

  angle1+=speed;

  // Set 2

  for (let i=0; i<n; i++){

    loc = 180/n;

    circles2[i].x = width/2 + r*cos(angle2+i*loc);

    circles2[i].y = height/2 + r*sin(angle2+i*loc);

    ellipse(circles2[i].x, circles2[i].y, sizes2[i], sizes2[i]);

​

  }

  for (let i=0; i<n; i++){

    if (sizes2[i] >= 100 || sizes2[i] <= 10){

      dsizes2[i] = dsizes2[i]*-1; 

    }

    sizes2[i] = sizes2[i] + dsizes2[i];

  }

​

  angle2-=speed;

​

}