createCanvas(1080, 1080);

  time1 = 0;

  time2 = 1;

  time3 = width / 2;

  count = 200;

  center = createVector(width / 2, height / 2);

  cirs = [];

  cols = ["#7400b8","#6930c3","#5e60ce","#5390d9","#4ea8de","#48bfe3","#56cfe1","#64dfdf","#72efdd","#80ffdb"];

  for(i = 0; i < count; i++){

    cirs[i] = new Cir(width / 2, height / 2, i);

  }

  noFill();

  stroke(255);

  strokeWeight(1);

  // blendMode(ADD);

  background(0);

}

​

function draw() {

  time1 = time1 + 0.005;

  time2 = time2 + 0.001;

  // if(time3 > 0){

  //   time3 = time3 - 0.1;

  // }

  for(i = 0; i < cirs.length; i++){

    cirs[i].update();

  }

}

​

class Cir{

  constructor(x, y, index){

    this.opos = createVector(x, y);

    this.pos = createVector(x, y);

    this.spo = createVector(width / 2 + 100, 0);

    this.index = index;

    this.spo.setHeading(TWO_PI / count * this.index);

    this.col = color(cols[this.index % cols.length]);

  }

  update(){

    // this.spo.setMag(map(noise(time2 + this.index / 50, this.index / 50), 0, 1, 0, time3));

    // this.spo.setMag(time3);

    this.spo.setMag(map(sin(this.spo.heading() + TWO_PI / count * this.index) , -1, 1, 0, width + 500))

    // this.spo.setHeading(map(noise(this.index / 50 + time1), 0, 1, -TWO_PI * 2, TWO_PI * 2));

    this.spo.setHeading(this.spo.heading() + 0.002 + (0.001 / count) * this.index);

​

    this.pos = p5.Vector.add(center, this.spo);

    // this.pos = createVector(map(noise(this.opos.x + time1 + (this.index / 100), this.opos.y + time2 + (this.index / 100))));

    // this.col.setAlpha(10);

    stroke(this.col)

    line(center.x, center.y, this.pos.x, this.pos.y);

  }

}