EaselJS线模糊

Question

我使用EaselJS作为HTML5画布的API。

我注意到以下代码：

line.graphics.setStrokeStyle(1).beginStroke("black").moveTo(100,100).lineTo(200,200);
stage.addChild(line);

...生成以下行：

我将厚度设置为1 - 但线条仍然模糊。如果放大快照，可以看到它实际占用3个像素。我相信我读到某处画布在两个像素之间绘制一个点，这样两个像素实际上都会被着色。并且您需要将绘制点的位置移动到像素宽度的一半，以便它落在整个像素上。

我的应用程序需要清晰的图像，请指教。

Answer 1

EaselJS只是canvas API的抽象 - 它绘制了指定坐标上的所有行。 snapToPixel API专门用于执行自动舍入，但不考虑您描述的半像素问题。

最佳实践方法是将所有内容放入容器中，并将容器置于正值或负值（0.5,0.5） - 这将调整所有内容，并且您可以在正常的坐标空间中工作，而不是抵消所有计算