如何使用html5画布绘制1px边框的矩形？

Question

我不知道为什么白点出现在创建的矩形的右下角。 （仅在21.0.1180.83和WinXP下的.89中可见）

这取决于画布高度......

http://jsbin.com/ejeyef/1/

Answer 1

它可能与Subpixel rendering有关。查看代码，执行以下操作：

c.rect(10.5, 10.5, 100, 100);

这意味着：“绘制一个矩形，尺寸为100x100px，坐标距离X为10.5px，距离Y为10.5px”。屏幕/浏览器无法呈现“半像素”，因此它总是在某处呈圆角。这可能是你问题的原因。

要解决此问题，请不要将半值用于此类事情。这很好用：

c.rect(10, 10, 100, 100);