let bubbles = [];

​

function setup() {

  createCanvas(600, 400);

}

​

function mouseDragged() {

  let r = random(10, 50);

  let b = new Bubble(mouseX, mouseY, r);

  bubbles.push(b);

}

​

function draw() {

  background(0);

​

  for (let bubble of bubbles) {

    bubble.move();

    bubble.show();

  }

​

  for (let bubble of bubbles) {

    bubble.move();

    bubble.show();

  }

}

​

class Bubble {

  constructor(x, y, r) {

    this.x = x;

    this.y = y;

    this.r = r;

  }

​

  move() {

    this.x = this.x + random(-5, 5);

    this.y = this.y + random(-5, 5);

  }

​

  show() {

    stroke(255);

    strokeWeight(4);

    noFill();

    ellipse(this.x, this.y, this.r * 2);

  }

}

​

// https://editor.p5js.org/jht1493/sketches/utpzYq_O8

// p5js Code! - Array of Objects - for-of

​

// Array of Objects

// Code! Programming with p5.js

// The Coding Train / Daniel Shiffman

// https://thecodingtrain.com/beginners/p5js/7.3-array-of-objects.html

// https://youtu.be/fBqaA7zRO58

// https://editor.p5js.org/codingtrain/sketches/1y_xfueO

​

​