Javascript 帆布网格赢得'；渲染不好

我有一些代码，可以让我在画布上画一个网格，有你喜欢的任意多条线。唯一的问题是，每当我尝试渲染25条或更多的线时（无论是水平线还是垂直线），即使不是大多数线，也有一些线甚至无法渲染。（当有40条或更多线时，这很容易观察到。） 渲染的行数可能因设备或浏览器而异-我还没有完全验证

以下是我正在使用的代码：

函数gID（id）{return document.getElementById（id）；}
函数gTag（tag）{return document.getElementsByTagName（tag）；}
var canvas=gID（“canvasandcrap”）；
var ctx=canvas.getContext（“2d”）；
canvas.width=document.body.clientWidth；
canvas.height=document.body.clientHeight；
var w=canvas.width，h=canvas.height；
var currenth=15，currentv=15；
函数createGrid（）{
设hlines=currenth；
设vlines=currentv；
设x=Math.round（w/hlines）；
设y=数学圆（h/V线）；
ctx.beginPath（）；
for（var i=0；i看起来
函数createGrid（）
中的数学不太正确

请看下面的代码：

我假设控件的值决定了行数


函数gID（id）{return document.getElementById（id）；}
函数gTag（tag）{return document.getElementsByTagName（tag）；}
var canvas=gID（“canvasandcrap”）；
var ctx=canvas.getContext（“2d”）；
canvas.width=document.body.clientWidth；
canvas.height=document.body.clientHeight；
var w=canvas.width，h=canvas.height；
var currenth=15，currentv=15；
函数createGrid（）{
设hlines=currenth；
设vlines=currentv；
设x=（w/hlines）；
设y=（h/v线）；
ctx.beginPath（）；
对于（var i=0；i