javascript - 在 Canvas 中绘制 1px 粗线创建 2px 粗线

Question

在这个 jsfiddle 中有一行的 lineWidth 为 1。

http://jsfiddle.net/mailrox/9bMPD/350/

例如:

ctx.lineWidth = 1;

但是画在 Canvas 上的线条是 2px 粗，如何创建 1px 粗的线条。

我可以绘制一个矩形(高度为 1 像素)，但我希望该线也适用于对 Angular 线。那么如何让这条线高 1px？

谢谢!

Answer 1

Canvas 从半个像素开始计算

ctx.moveTo(50,150.5);
ctx.lineTo(150,150.5);

所以从一半开始就可以解决

固定版本:http://jsfiddle.net/9bMPD/357/

This answer解释为什么它以这种方式工作。