How to fix the Animation effect for forloop

Question

how to make animation for whole for loop in js?

for (var n = 0; n < lessons.length; n++) {
            var j = n % 2 + 2;

            layer.add(new Konva.Circle({
                name:""+lessons[n].id,
                x: x + (n * 90),
                y: y * j,
                sides: 6,
                radius: 50,
                fill: 'red',
                stroke: 'black',
                strokeWidth: 4,
                text: lessons[n].title,
            }));

Answer 1

Just add an animation for each circle you add...

for (var n = 0; n < lessons.length; n++) {
            var j = n % 2 + 2;

            var circle = new Konva.Circle({
                name:""+lessons[n].id,
                x: x + (n * 90),
                y: y * j,
                sides: 6,
                radius: 50,
                fill: 'red',
                stroke: 'black',
                strokeWidth: 4,
                text: lessons[n].title,
            });

            // example animation from konvajs.org
            var anim = new Konva.Animation(function(frame) {
            var time = frame.time,
                timeDiff = frame.timeDiff,
                frameRate = frame.frameRate;

                // update stuff e.g.:
                
                circle.x(frame);
                
            }, layer);

            layer.add(circle);
            anim.start();
}