我正在学习帆布,我的目标是伸出援手。在线的每个示例都说我应该在stroke()
内拨打onmousemove
。如果我的颜色strokeStyle
具有100%的不透明度,则此操作符合预期。但是,如果我将rgba
与0.3
alpha值一起使用,则反复调用stroke()
会重新着色整个路径,从而最终迫使该行变为不透明。
我尝试通过画线,停止路径和开始新路径来克服这个问题。这样做了一半 - 路径的重叠部分将是暗的两倍 - 如果你使用粗线宽,这是非常有问题的。
最后 - 我将stroke()移动到onmouseup
- 除非用户在释放鼠标之前无法看到他正在绘制的内容,否则效果会很好。
我该如何解决这个问题?
答案 0 :(得分:3)
解决此问题的一种方法是记住每个mousemove坐标并将它们放在一个列表中。在每个鼠标移动时,清除画布并将整个路径加上最新点重绘到画布上。
这会让它看起来很像你想要的。
你走了:
如果您希望画布在行之间保持不变,则需要在每个鼠标向上将其保存到内存中画布并在每一步重绘它。如果你想看看它的样子,请看这里:
编辑:修改了以Opera教程方式进行修改的示例:http://jsfiddle.net/2vAQE/