使用 createjs 在画布上绘图是别名答案

【问题标题】：drawing on canvas with createjs is aliased使用 createjs 在画布上绘图是别名
【发布时间】：2013-06-23 09:54:31
【问题描述】：

我在使用 createjs 库在 html5 画布上绘图时遇到问题。图纸不平滑，但有锯齿。似乎很多人只对 chrome 有这个问题，但对我来说，在 IE 和 firefox 中也没有什么不同。我还发现应该可以use alphamaskfilter to achieve anti-aliasing，但我不知道怎么做。如果这是要走的路，有人可以告诉我该怎么做吗？

这是部分代码。它使用鼠标移动并从鼠标之前的位置到鼠标现在的位置绘制一条线：

var drawing = new createjs.Shape();
drawing.name = pathID.toString();
drawing.graphics.ss(point.width, "round").s(point.color);
drawing.graphics.mt(lastPoint.x, lastPoint.y);        
drawing.graphics.lt(point.x, point.y);

// Draw onto the canvas, and then update the container cache.
wrapper.addChild(drawing);
wrapper.updateCache("source-over");

【问题讨论】：

请将您的解决方案添加为答案（并将其标记为正确），这样人们就会知道您的问题不再需要关注。

标签： canvas drawing antialiasing easeljs createjs

【解决方案1】：

我找到了解决方案。奇怪的是，如果你没有像这样给 wrapper.updateCache() 提供参数，它会变得很顺利：

var drawing = new createjs.Shape();
drawing.name = pathID.toString();
drawing.graphics.ss(point.width, "round").s(point.color);
drawing.graphics.mt(lastPoint.x, lastPoint.y);        
drawing.graphics.lt(point.x, point.y);

// Draw onto the canvas, and then update the container cache.
wrapper.addChild(drawing);
wrapper.updateCache();

【讨论】：