微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

如何修复 forloop 的动画效果

如何解决如何修复 forloop 的动画效果

如何在js中为整个for循环制作动画?

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,}));

解决方法

只需为您添加的每个圆圈添加一个动画...

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();
}

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。