Creative Technologies Lab | dokuWiki

This is an old revision of the document!

let circles = []; let group1 = []; let group2 = []; let speedX = 2; let speedY = 1;

function setup() {

createCanvas(600, 400);

// Gruppe 1: Bewegt sich synchron (gemeinsames Schicksal)
for (let i = 0; i < 6; i++) {
  group1.push(new MovingCircle(random(100, 300), random(100, 300), true));
}

// Gruppe 2: Bewegt sich zufällig
for (let i = 0; i < 6; i++) {
  group2.push(new MovingCircle(random(300, 500), random(100, 300), false));
}

}

function draw() {

background(240);

// Zeichne und bewege die Gruppen
for (let c of group1) {
  c.moveTogether();
  c.display(color(0, 102, 255)); // Blau für gemeinsame Bewegung
}

for (let c of group2) {
  c.moveRandom();
  c.display(color(255, 102, 0)); // Orange für zufällige Bewegung
}

}

class MovingCircle {

constructor(x, y, grouped) {
  this.x = x;
  this.y = y;
  this.grouped = grouped;
}

moveTogether() {
  this.x += speedX;
  this.y += speedY;
  if (this.x > width || this.y > height) {
    this.x = random(100, 300);
    this.y = random(100, 300);
  }
}

moveRandom() {
  this.x += random(-2, 2);
  this.y += random(-2, 2);
}

display(col) {
  fill(col);
  noStroke();
  ellipse(this.x, this.y, 20);
}

}