在使用createjs画布进行绘图时,可能存在锯齿现象。

3
我使用createjs库在html5画布上绘图时遇到了问题。绘制出来的图形不够平滑,存在锯齿状现象。似乎许多人仅在chrome上遇到此问题,但我在IE和firefox中也没有区别。我还发现可以通过使用alphamaskfilter实现抗锯齿效果,但我不知道该如何操作。如果这是解决问题的方法,请有经验的人告诉我如何操作。
以下是部分代码。它使用鼠标移动事件并从鼠标之前的位置向鼠标现在的位置绘制一条线:
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");

1
请将您的解决方案添加为答案(并标记为正确),这样人们就会知道您的问题不再需要关注了。 - Simon Groenewolt
1个回答

0
我找到了解决方案。奇怪的是,如果你不给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();

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接