Question

我已经在SO上尝试了一些不同的方法，但似乎无法让它发挥作用。

我试图在setInterval函数中更新数组中随机选择的项目，但随机数不会改变。

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

这都是使用lazylinepainter插件：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等）中随机选择一个项目。

Answer 1

在我看来，您只调用一次实际函数，然后将其分配给randomColor，这会被反复使用。

你应该做的是在需要的地方调用它：

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

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

在SetInterval函数中不更新随机数

1 个答案: