Question

首先，我在jsfiddle的完整代码：https://jsfiddle.net/f5z8qtcp/13/

重现我的问题：

单击图像并随意拖动鼠标而不释放鼠标右键。

你会看到它在图像上留下痕迹！

如何在不重新加载图像的情况下清除所有痕迹（这会使我的浏览器滞后于更大尺寸的图像）？

我们的想法是在每次添加新矩形时清除跟踪但不重新加载图像。

我尝试过：

ctx.clearRect(0, 0, canvas.width, canvas.height);

没有效果......这将删除矩形。

有什么建议吗？

Answer 1

你在鼠标移动时正在绘制图像，你不能以简单的方式撤消它，当有人例如缩小他的选择时。修复它的最快方法是使用一些div覆盖图像。鼠标释放后 - 然后删除div并绘制图像最终选择。