​

setTimeout(function() {

    // Make an instance of two and place it on the page.

    var elem = document.body;

    var params = { width: window.innerWidth, height: window.innerHeight };

    var two = new Two(params).appendTo(elem);

​

    var n = 10000;

    var balls = [];

​

    for (var i = 0; i < n; i++) {

​

        // two has convenience methods to create shapes.

        var circle = two.makeCircle(0, 0, 50);

        // The object returned has many stylable properties:

        circle.fill = '#FF8000';

        circle.stroke = 'orangered'; // Accepts all valid css color

        circle.linewidth = 5;

​

        balls.push({

            x: Math.random() * window.innerWidth,

            y: Math.random() * window.innerHeight,

            v: 1,

            a: Math.random() * 2 * Math.PI,

            element: circle,

        });

    }

​

    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.translation.set(ball.x, ball.y);

        }

​

        // Don't forget to tell two to render everything

        // to the screen

        two.update();

​

        window.requestAnimationFrame(move); //

    }

​

    move();

}, 1000);

​