如何重新绘制画布的特定部分？

Question

我正在使用HTML 5和<canvas>制作JavaScript游戏。

在我的画布中，我正在加载高分辨率图像。在每一分钟中，会有一些对象到这个画布。如果用户点击它。它将从屏幕上删除。

我的问题：

我正在使用clearRect()函数清除画布。并再次重新绘制所有图像。每次重新绘制整个内容时是否有必要？有没有选择重新绘制该特定区域？

当我使用clearRect()清除该对象的确切区域时。背景图片也被删除了。有没有办法保存背景图像的特定部分并使用此保存的图像绘制该部分？ （因为我的对象在画布上移动，我需要动态地检索图像数据）

我是WebTechnology和HTML 5的新手。所以请帮助我。提前致谢

Answer 1

将画布视为绘画，一旦应用了内容，就无法删除内容的“图层”。您可以使用clearRect(x,y,height,width)指定要清除的画布的一部分，但是您始终需要重新绘制已删除内容的背景。 drawImage()函数接受参数在特定位置绘制图像的特定部分，但可能更符合您要使用的是imageData。

我建议您在画布上阅读Mozilla Dev Network: Canvas

Answer 2

有一些画布层库可以增加对图层的支持：

• CanvasLayers
• CanvasStack