canvas的restore会改动之前创建的路径位置
发布于 6 年前 作者 ldeng 7856 次浏览 来自 问答

实际开发中需要在不同的位置绘制某个相同的形状,再创建剪切区域;由于形状较为复杂,所以将形状绘制过程写成函数,在save与restore之间,通过translate变换原点,调用绘制形状的方法;最后clip实现需求。

这种方式在HTML5 canvas上没有问题,

但在小程序的canvas上,restore之后在clip,创建的剪切形状的位置是translate之前的位置。(经测试,restore之后fill或stroke也有这个问题


按正常的逻辑,之前创建的路径被确立,restore只应修改绘图上下文,不应修改已创建的路径,HTML5 Canvas的行为是这样的,而小程序的canvas似乎是在调用fill,stroke,clip等方法时,以当前绘图上下文重新创建了一次路径。


如果我在save与restore之间填充了路径,于restore后再调用clip,就会出现两个矩形剪切区域,说明在调用fill,stroke,clip等方法时,真的以当前上下文重新创建了一次路径。。。



3 回复

4天过去了

你好,问题已复现,我们会在后续版本中进行修复。

回到顶部