Old school D3 from simpler times

All examples By author By category About

enjalot

Full window Github gist

p5: force multiplier

Built with blockbuilder.org

<!DOCTYPE html>
<head>
  <meta charset="utf-8">

<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.5.4/p5.min.js"></script>
  <style>
    body { margin:0;position:fixed;top:0;right:0;bottom:0;left:0; }

</style>
</head>

<body>
  <script>
    var width = 960;
    var height = 500;
    var radius = 50;
    var dt = 0.03
    var particles = [];
    function setup() {
      console.log("size")
      createCanvas(960, 500);
      
    }

function draw() {
      background(0,0,0,205)
      ellipse(mouseX, mouseY, 80, 80);
      var p;
      for(var i = 0; i < particles.length; i++) {
        p = particles[i]
        ellipse(p.x, p.y, 50, 50);
        p.x += p.vx * dt
        p.y += p.vy * dt
        
      }
    }
    
    // generate stuff over time
    var period = 850
    
    function loop() {
      particles.push({
        x: 100,
        y: 200,
        vx: 40 + Math.random() * 40,
        vy: -50 + Math.random() * 100
      })
      //if(Math.random() < 0.4) particles.splice(0,1)
      setInterval(loop, period);
    }
    setInterval(loop, period);

</script>
</body>

https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.5.4/p5.min.js