canvas的restore会改动之前创建的路径位置
实际开发中需要在不同的位置绘制某个相同的形状,再创建剪切区域;由于形状较为复杂,所以将形状绘制过程写成函数,在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 回复