Javascript 如何从画布中清除Path2D

我试图通过在循环中将Path2D渲染到画布中来制作动画。 我需要清除或编辑现有的Path2D，并每隔几秒钟放置一个新的Path2D。我尝试过clearRect（）方法，但它似乎没有任何作用。这是我的密码：

update(options) {
    this.ctx.clearRect(0, 0, this.canvas.nativeElement.innerWidth, this.canvas.nativeElement.innerHeight);
    this.ctx.beginPath();
    const path = this.cardinal(options.points, true, 1); // SVG path
    const P2D = new Path2D(path);
    this.ctx.fill(P2D);
}

如何清除路径或编辑现有路径

修正：

---

一直未定义返回。我必须使用画布的.width和.height属性才能使其正常工作。

不幸的是，一旦在画布上绘制了某些内容，它就会留在画布上。如果你想改变一件事，你需要重新油漆整个

---

关于

clearRect

——第三个和第四个参数不应该是画布节点的实际大小，而是它的分辨率，即它的宽度和高度属性，在您的例子中：

this.canvas.width

和

this.canvas.height
添加一个console.log（this.canvas.nativeElement.innerWidth）并检查这一点。这是否返回正确的val。请告诉我们。否则就做一把小提琴你可以在这里查看这个链接是的，结果显示innerWidth/Height返回未定义。谢谢，一切都很有魅力！我已使用您的解决方案更新了我的答案：）
this.canvas.nativeElement.width, this.canvas.nativeElement.height