Skip welcome & menu and move to editor
Welcome to JS Bin
Load cached copy from
 
<!DOCTYPE html>
<svg>
</svg>
 
var n = 1000;
var balls = [];
var svg = document.querySelector('svg')
for (var i = 0; i < n; i++) {
  var circ = document.createElementNS('http://www.w3.org/2000/svg','circle');
  circ.setAttribute('cx', '100');
  circ.setAttribute('cy', '100');
  circ.setAttribute('r', '50');
  circ.id = i;
  svg.appendChild(circ);
  balls.push({
    x: Math.random() * window.innerWidth,
    y: Math.random() * window.innerHeight,
    v: 1,
    a: Math.random() * 2 * Math.PI,
    element: circ,
  });
}
function move() {
  for(b in balls) {
    var ball = balls[b];
    ball.x += ball.v * Math.cos(ball.a);
    ball.y += ball.v * Math.sin(ball.a);
    ball.a += 0.03;
    ball.element.setAttribute('cx', ball.x);
    ball.element.setAttribute('cy', ball.y);
  }
  window.requestAnimationFrame(move); //
}
move();
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
anonymouspro
0viewers