在清除后绘制图像时出现画布'形状工件'

Question

我的网络应用程序中有一个非常令人费解的画布工件/错误。 清除画布后，在将另一个图像绘制到画布时，会先重新显示先前已清除的圆形，但只会出现一次。图像已经初始化一次：

this.image = new Image();
this.image.src = imageroot + image + '.png';

在调试器中，我打破每个图像绘制，发现这个形状工件仅在我第一次绘制此图像时出现。

context.drawImage(this.image, x - width / 2, z - height / 2, width, height);

虽然它不能出现在图像中，但是相同图像的后续绘制只是表明这个圆圈确实不在我绘制到画布的图像中。但我很肯定它在调用此函数时出现。所以它从某个地方突然出现。

我想我在某处做错了，因为这是一种非常奇怪的行为，但我无法找到它并且无法发布数百行代码，所以我想知道什么样的误用/ wrongdoing可能会导致这样的工件出现在这样一个意外的上下文中（调用drawImage），所以我至少要跟踪一个跟踪来捕获这个bug。

Answer 1

请务必使用beginPath()清除之前的所有路径。

当您清除画布时，只需调用此方法，并且下次中风或填充时不会重新渲染先前的路径。