miliseconds on canvas

HTML

<canvas id="canvas" width="300" height="300">
</canvas>

<!--canvasをクリックでストップ/再開-->

CSS

#canvas{
  display:block; margin:10px auto;
  outline:1px solid #000;
  border:1px solid #ccc;
}

#js-On {
  width:0; height:0; overflow: hidden;
  margin-left: -9999px;
}

JavaScript

var canvas = document.getElementById("canvas");
var ctx = canvas.getContext("2d");
var cw = canvas.width,
    ch = canvas.height;
var flg = 0;

init();
canvas.addEventListener("click", init, false);

function init(){
  if(flg == 0){
    flg = 1;
    myTimer = setInterval(draw,25);
  } else {
    flg = 0;
    clearInterval(myTimer);
  }
}

function draw() {
    var d = new Date,
        msec = d.getMilliseconds(),
        sec = d.getSeconds(),
        rectW = cw*msec/1000,
        rectH = 100;
    ctx.clearRect(0,0,cw,ch);
    ctx.globalCompositeOperation = "source-over";
    ctx.fillStyle = "#c06";
    ctx.font = "bold 50px 'Times New Roman', Times, Serif";
    ctx.fillText(sec,50,180);
    ctx.globalCompositeOperation = "xor";
    ctx.fillStyle ="#c06";
    ctx.fillRect(0,ch/2-rectH/2,rectW, rectH);
}