Canvas小结（canvas-矩形）

rect() 方法创建矩形

fillRect() 方法绘制“已填色”的矩形。默认的填充颜色是黑色。通过fillStyle修改填充色

strokeRect() 方法绘制矩形（不填色）。笔触的默认颜色是黑色

rect()

    var c = document.getElementById('mycanvas');
    var ctx = c.getContext('2d');
    ctx.rect(20,20,50,30);
    ctx.stroke();
    ctx.fillStyle = 'red';
    ctx.fillRect(80,20,50,30);
    ctx.strokeRect(20,80,50,30);
    ctx.fillRect(80,80,80,50);

clearRect() 方法清空给定矩形内的指定像素。

clearRect()

    var c2 = document.getElementById('mycanvas2');
    var ctx2 = c2.getContext('2d');
    ctx2.fillStyle = 'red';
    ctx2.fillRect(10,10,200,100);
    //clearRect() 方法清空给定矩形内的指定像素。
    //context.clearRect(x,y,width,height);
    ctx2.clearRect(20,20,100,50);