Можно ли обвести путь по частям на холсте? - PullRequest
1 голос
/ 05 января 2020

Я хочу нарисовать определенный путь шаг за шагом, с определенным периодом времени между любыми двумя шагами.

Код, который у меня сейчас есть,

let canvas = document.getElementById("c");
let ctx = canvas.getContext('2d');

let p = 'M10 10 h 80 v 80 h -80 Z';
let pathArr = ["M10", "10 h", "80 v", "80 h", "-80 Z"];
let lgt = pathArr.length;
let i = 0;

(function draw() {
    if(i < lgt){
        let pathElem = new Path2D(pathArr[i]);
        ctx.stroke(pathElem);
        i++;
        setTimeout(draw, 200);
    }
})();

Предполагаемая функция: чтобы сделать то, что сделал бы ctx.stroke(p), но шаг за шагом, как поглаживание элементов pathArr по одному с задержкой 200 мс между каждыми двумя штрихами.

Но этот код не работать как задумано. Что я делаю не так, и что я должен сделать, чтобы заставить его работать как нужно?

...