将空白画布修改为矩阵

Question

我知道＆lt;画布＆GT; ＆LT; /画布＆GT;绘制一个空白区域，我必须添加形状。

在我的项目中，用户需要绘制矩阵，而不是白色空间。我该怎么做？

Answer 1

以下是如何在html画布上绘制网格线：

演示：http://jsfiddle.net/m1erickson/DwdX6/

function drawGrid(lineCount){
    var xSpan=cw/lineCount;
    var ySpan=cw/lineCount;
    ctx.clearRect(0,0,cw,ch);
    ctx.save();
    if(lineCount/2===parseInt(lineCount/2)){
        ctx.translate(.5,.5);
    }
    ctx.beginPath();
    for(var i=0;i<lineCount;i++){
        var x=(i+1)*xSpan;
        var y=(i+1)*ySpan;
        ctx.moveTo(x,0);
        ctx.lineTo(x,ch);
        ctx.moveTo(0,y);
        ctx.lineTo(ch,y);
    }
    ctx.lineWidth=0.50;
    ctx.stroke();
    ctx.restore();
}