let dens = 5;

let cols = ["#ffc857","#ee9550","#e9724c","#d74845","#c5283d","#a41c32","#471d33","#3e2e6d","#255f85","#269480"];

// let center = undefined;

​

function setup() {

  createCanvas(1080, 1080);

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

  for(x = 0; x < width / dens; x++){

    for(y = 0; y < height / dens; y++){

      dots[dots.length] = new Dot(x * dens + random(-dens, dens), y * dens + random(-dens, dens), dots.length);

    }

  }

  background(220);

}

​

function draw() {

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

    if(dots[i] !== undefined){

      dots[i].update();

    }

  }

}

​

class Dot{

  constructor(x, y, index){

    this.pos = createVector(x, y);

    this.vel = createVector(1, 0);

    this.index = index;

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

    this.odist = p5.Vector.sub(this.pos, this.center);

    this.dist = p5.Vector.sub(this.pos, this.center);

    this.vel.setHeading(this.dist.heading() + HALF_PI);

    this.c = this.index % cols.length;

    this.col = undefined;

  }

  update(){

    this.col = color(cols[this.c]);

    strokeWeight(map(this.dist.mag(), 0, 1527, 0.1, 20))

    stroke(this.col);

    point(this.pos.x, this.pos.y);

    this.dist = p5.Vector.sub(this.pos, this.center);

    this.vel.setHeading(this.dist.heading() + HALF_PI + map(noise(this.pos.x / 100, this.pos.y / 100), 0, 1, -1, 2));

    this.pos.add(this.vel);

    if(this.dist.mag() < 5){

      dots[this.index] = undefined;

    }

  }

}