随机数未在设置间隔函数中更新

Random number not updating in SetInterval function

本文关键字：函数 更新 设置 随机数      更新时间：2023-09-26

我已经尝试了几种不同的方法来解决这个问题，但似乎无法让它工作。

我正在尝试在 setInterval 函数中更新数组中随机选择的项目，但随机数没有变化。

它是在第一次加载时随机选择的，但每次函数再次运行时，它都不会在事后更新。

这一切都是使用懒线画家插件：https://github.com/camoconnell/lazy-line-painter

var pathArray = [pathOne,pathTwo,pathThree,pathFour,pathFive,pathSix],
colors = ['#e51616','#0000FF','#FFFF00','#00FF00'],
drawBox = $('#drawing-box'),
svg = $('#drawing-box svg'),
svgPath = document.createElementNS("http://www.w3.org/2000/svg", "path");
function randomFrom(array) {
   return array[Math.floor(Math.random() * array.length)];
}
randomColor = randomFrom(colors);
var i = Math.floor(Math.random() * (5 - 0 + 1));
console.log(i);
function Draw(){
   var drawLoop = setTimeout(function (){
                    $('#drawing-box svg path').animate({'opacity':0},300);
                    setTimeout(function(){
                        $('#drawing-box svg path').remove();
                        drawBox.lazylinepainter('paint');
                        console.log(pathArray[i]);
                    },350);
                },5500);
   var drawFunc = drawBox.lazylinepainter({
                "svgData": pathArray[i],
                "strokeColor": randomColor,
                "strokeWidth": 5,
                "responsive": true,
                "onComplete": drawLoop
            });
   drawFunc.lazylinepainter('paint')
};
setInterval(function(){
   Draw();
},6000);

这是在jsFiddle—————

一遍

又一遍地重新运行小提琴以查看随机选择的不同路径（因为它不会以其他方式更新）。

希望那个片段很清楚，仍然在那里尝试一些不同的东西。

最终目标是让该线在每个间隔内从 pathArray （pathOne、pathTwo、pathThree 等）中随机选择一个项目。

在我看来，

您只调用一次实际函数，然后将其分配给randomColor该函数被一遍又一遍地使用。

相反，您应该做的是在需要的地方调用它：

var drawFunc = drawBox.lazylinepainter({
            "svgData": pathArray[i],
            "strokeColor": randomFrom(colors),
            "strokeWidth": 5,
            "responsive": true,
            "onComplete": drawLoop
        });

这样你每次都能得到一个新鲜的。

相关文章：