Как очистить Path2D от холста

Question

Я пытаюсь сделать анимацию путем рендеринга Path2D в canvas в цикле.Мне нужно очистить или редактировать существующий 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);
}

Как очистить путь или, возможно, отредактировать существующий?

ИСПРАВИТЬ:

this.canvas.nativeElement.width, this.canvas.nativeElement.height

возвращаются неопределенными.Мне пришлось использовать свойства .width и .height холста, чтобы он работал.

Answer 1

К сожалению, если что-то нарисовано на холсте, оно останется там.Если вы хотите изменить что-то одно, вам нужно перекрасить целое.

А насчет clearRect - 3-й и 4-й аргументы должны быть не фактическим размером узла холста, а его разрешением, то есть ширинойи атрибут высоты, в вашем случае: this.canvas.width и this.canvas.height