grid

by graphikos

HTML

<canvas id="cnv" width="123" height="123"></canvas

CSS

canvas {
    background: #f4f4f4;
    margin: 20px;
}

JavaScript

var bw = 120;
var bh = 120;

var context = document.getElementById('cnv').getContext("2d");

for (var x = 0; x <= bw; x += 40) {
    context.moveTo(0.5 + x, 0);
    context.lineTo(0.5 + x, bh);
}

for (var x = 0; x <= bh; x += 40) {
    context.moveTo(0, 0.5 + x);
    context.lineTo(bw + 0, 0.5 + x);
}

context.strokeStyle = "black";
context.stroke();