html, body, #container {

    width: 100%;

    height: 100%;

    margin: 0;

    padding: 0;

}

var stage = acgraph.create("container");

​

var start;

var finish;

​

var labelBg = stage.rect();

var label = stage.text(130,130);

    label.text("Click here to start the process of rendering");

    var labelBounds = label.getBounds();

    labelBg

.setX((labelBounds.left)-20)

.setY((labelBounds.top)+20)

.setWidth(labelBounds.width+40)

.setHeight(labelBounds.height-40)

.fill("#fff")

.stroke("#000")

.cursor("pointer");

    label.zIndex(1000000);

    label.disablePointerEvents(true);

    labelBg.zIndex(1000000);

​

// this is to be performed on a click

labelBg.listenOnce("click", function(){

​

    start = (new Date()).getTime();

​

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

var left = Math.random() * 300;

var qwer = Math.random() * 300;

​

var rect = stage.rect(left, qwer, 10, 10);

rect.fill('green');

    }

​

    finish = (new Date()).getTime();

    label.text((finish - start) + "ms");    

​

    var labelBounds = label.getBounds();

    labelBg

.setX((labelBounds.left)-20)

.setY((labelBounds.top)+20)

.setWidth(labelBounds.width+40)

.setHeight(labelBounds.height-40);

});