metaball - OpenProcessing

mySketch
xxxxxxxxxx
 
let particles = [];
const detail = 100;
let mult = 1;
​
function setup() {
  createCanvas(windowWidth, windowHeight);
  background(100);
​
  for (let i = 0; i < 2; i++) {
    particles.push({
      pos: createVector(random(width), random(height)),
      vel: createVector(random(-10, 10), random(-10, 10))
    });
  }
​
  noStroke();
}
​
function draw() {
  let x = 0;
  let y = 0;
  let stepX = width / detail;
  let stepY = height / detail;
​
  const palette = [color("#D64933"), color("#EA9010"), color("#2D854A"), color("#3587A4"), color("#573280"), color("#DA4167")];
​
  for (let i = 0; i < detail; i++) {
    for (let j = 0; j < detail; j++) {
      let total = 0;
​
      for (let particle of particles) {
        total += 1 / (dist(x, y, particle.pos.x, particle.pos.y))
      }
​
      const index = map(total, 0.001 * (particles.length + 1), 0.0035 * (particles.length + 1), 0, palette.length - 1, true);
​
      let cellColor = palette[floor(index)];
​
      if (index !== palette.length - 1) {
        cellColor = lerpColor(palette[floor(index)], palette[floor(index) + 1], index % 1);
      }
​
      fill(cellColor);
      rect(x, y, stepX, stepY);
​
      x += stepX;
​
    }
    x = 0;
    y += stepY;
  }
​
  for (let particle of particles) {
    if (particle.pos.x * mult < 0 || particle.pos.x * mult > width) {
      particle.vel.x *= -1;
    }
​
    if (particle.pos.y * mult < 0 || particle.pos.y * mult > height) {
      particle.vel.y *= -1;
    }
​
    particle.pos.add(particle.vel)
  }
​
  if (keyIsDown(UP_ARROW) || keyIsDown(RIGHT_ARROW)) {
    for (let particle of particles) {
      if (particle.vel.x < 20 && particle.vel.y < 20) {
        particle.vel.mult(1.1);
      }
    }
  }
​
  if (keyIsDown(DOWN_ARROW) || keyIsDown(LEFT_ARROW)) {
    for (let particle of particles) {
      if (particle.vel.x > -20 && particle.vel.y > -20) {
        particle.vel.mult(-1.1);
      }
    }
  }
​
}
​
function mouseClicked() {
  particles.push({
    pos: createVector(mouseX, mouseY),
    vel: createVector(random(-10, 10), random(-10, 10))
  });
}