Genuary - particles 2 - OpenProcessing

mySketch
xxxxxxxxxx
 
let cols, rows, layers;
let scale = 45;
let grid = [];
let angle = 0;
let displayedCircles = [];
​
function setup() {
  createCanvas(400, 400, WEBGL);
  cols = 40;
  rows = 30;
  layers = 20;
​
  for (let i = 0; i < cols; i++) {
    grid[i] = [];
    for (let j = 0; j < rows; j++) {
      grid[i][j] = [];
      for (let k = 0; k < layers; k++) {
        grid[i][j][k] = new Circle(
          (i - cols / 2) * scale,
          (j - rows / 2) * scale,
          (k - layers / 2) * scale
        );
      }
    }
  }
​
  // Select random circles to display and store their properties
  for (let i = 0; i < cols; i++) {
    for (let j = 0; j < rows; j++) {
      for (let k = 0; k < layers; k++) {
        if (random(1) > 0.95) {
          displayedCircles.push(grid[i][j][k]);
        }
      }
    }
  }
}
​
function draw() {
  background(20);
  
  let camX = sin(angle) * 1000;
  let camZ = cos(angle) * 50;
  let camY = cos(angle) * 500;
  camera(camX, camX, camZ, 0, 0, 0, 0, 1, 0);
  angle += 0.03;
​
  // Display the selected circles with their stored properties
  displayedCircles.forEach(circle => {
    circle.display();
  });
}
​
class Circle {
  constructor(x, y, z) {
    this.x = x;
    this.y = y;
    this.z = z;
    this.diameter = random(3, 18); // Random size
    this.speed = random(0.1, 0.5);
    this.color = color(random(255), random(255), random(255)); // Random color
  }
​
  move() {
    this.x += random(-this.speed, this.speed);
    this.y += random(-this.speed, this.speed);
    this.z += random(-this.speed, this.speed);
  }
​
  display() {
    push();
    translate(this.x, this.y, this.z);
    noStroke();
    fill(this.color);
    sphere(this.diameter);
    pop();
  }
}