清除画布中的一部分答案

【问题标题】：Clear a portion in Canvas清除画布中的一部分
【发布时间】：2012-12-12 04:45:21
【问题描述】：

我正在 Canvas 中创建动画。最初，画布上会绘制一组图像。一定时间后，比如 5 秒，必须将图像从其原始位置清除并在单独的位置绘制。

为了清除图像，我尝试使用 context.clearRect() 清除该部分，但没有运气。有没有其他方法可以做到这一点？

【问题讨论】：

.clearRect() 有什么问题？这应该是清除画布（矩形）部分的正确方法。
没有任何结果。当我清除整个画布时它会起作用
.clearRect() 应该可以解决问题。示例：jsbin.com/ajohar/1/edit
感谢您的样品。我刚刚发现 clearRect() 清除了颜色，但它没有清除图像。
@S.RaviKiran 画布没有“颜色”与“图像”的概念——它只知道像素。 clearRect 将用于清除图像。这是fiddle demonstration。（顺便说一句，你从哪里听说 clearRect 无法清除图像？这对于画布作为一个愚蠢的像素网格的工作方式来说是没有意义的。）

【解决方案1】：

clearRect 是正确的方法。请注意，如果您应用了转换，它可能会清除画布中的另一个矩形。您可以随时使用以下方法解决此问题：

// I have lots of transforms right now
ctx.save();
ctx.setTransform(1, 0, 0, 1, 0, 0);
// Will always clear the right space
ctx.clearRect(x, y, width, height);
ctx.restore();
// Still have my old transforms

【讨论】：