如您在上图中所看到的，我的等距正方形之间有可见线，这是由于每个正方形彼此重叠而造成的。现在，由于我用来绘制的坐标系(并且我不想更改它)，因此不可避免地会出现重叠。
这是我用来绘制正方形的代码
cRenderContext.beginPath();
cRenderContext.moveTo(iPosX, iPosY);
cRenderContext.lineTo(iPosX + iTileWidthIncrement, iPosY - iTileHeightIncrement);
cRenderContext.lineTo(iPosX + iTileWidth, iPosY);
cRenderContext.lineTo(iPosX + iTileWidthIncrement, iPosY + iTileHeightIncrement);
cRenderContext.lineTo(iPosX, iPosY);
cRenderContext.fillStyle = "rgba(1, 0, 1, 1)";
cRenderContext.fill();
cRenderContext.closePath();
我要实现的是在没有任何可见轮廓的情况下绘制正方形，所以基本上有没有办法停止填充以完成当前重叠的事情？
编辑:我会提到每个正方形的绘制颜色略有不同，所以我不能只用一种颜色填充整个区域并完成(它看起来全是黑色，但红色或蓝色 channel 中的每种颜色相差1)
最佳答案
比较一下:
http://jsfiddle.net/HmVtz/
有了这个:
http://jsfiddle.net/HmVtz/1/
看到不同？
代码上的区别是我在绘制一个半像素而不是一个像素。这样的 Canvas 很奇怪。有时请阅读抗锯齿/亚像素渲染。
有关为什么这样做的简单说明，请参见“Ask Professor Markup here”。