how to draw grid using html5 and (canvas or svg)

Question

I want to draw a grid as shown in image but I totally don\'t have idea that where should I begin. Should I use SVG or should I use Canvas w

Answer 1

I am posting my code using canvas here on SO but I am also creating a working sample on JSFiddle here.

Using the canvas approach you can make the grid size dynamic by changing the separation parameter.

However, if your grid size is going to be static I feel that maybe you don't need to draw the grid. Just for the sake of displaying a grid to the user you could use CSS to repeat a background image as demonstrated in the fiddle here. That will also be good on page performance.