HTML5画布clipRect无法正常工作

Question

Fiddle Link: http://jsfiddle.net/rorLnaqt/3/

打开上面的链接。我在一个矩形内绘制了两个样条曲线系列，并在从矩形中绘制时剪切了两个样条曲线。如果我使用clipRect选项，则样条线系列无法正确渲染。如果我评论它工作正常。

以下小提琴输出图像是预期结果：

fiddle Link: http://jsfiddle.net/rorLnaqt/4/

因为我已经删除了clipRect选项。

任何人请提出解决这个问题的想法。对于我的场景，每个系列都必须使用clipRect（）。所以我无法删除clipRect。

谢谢， Bharathi

Answer 1

请记住在定义剪辑路径时也使用beginPath()，否则旧路径将作为剪辑的基础（例如，第一个剪辑蒙版的边框方块和第二个剪辑蒙版的样条线）： / p>

context.beginPath();
context.rect(47, 20, 833, 351);
context.clip();

<强> Updated fiddle