p5.j​​s：为什么我的椭圆会闪烁？

Question

我有一个椭圆可以通过draw（）进行缩放，但由于某种原因，它会无法控制地闪烁。 我似乎无法弄清楚为什么。 我怀疑它与setTimeout有关。 我需要它因为我需要在绘制椭圆之前等待10秒以下是代码：

//diameter of ellipse that increments
var dia1 = 0;
var dia2 = 0;

function setup() {
createCanvas(400,400);
stroke(255);
noFill();
frameRate(40);
}  

//draw and increment ellipse
function circle1() {  
ellipse(width/2,height/2, dia1,dia1);

dia1 = dia1+1;
if (dia1 >= width) {
  dia1 = 0;
}

}
function circle2() {  
ellipse(width/2,height/2, dia2,dia2);
dia2 = dia2+1;
if (dia2 >= width) {
  dia2 = 0;
}

}



function draw() {


background(40,40,40);

//wait 10 seconds before drawing ellipse
setTimeout(function() { circle1(); }, 10000);

circle2();


console.log(dia1);


}

Answer 1

您不应该使用setTimeout()来调用绘图函数。

如果要进行计时，请使用millis()函数。 参考中提供了更多信息，但基本程序如下所示：

function draw(){
   background(0);
   if(millis() > 10000){
      ellipse(width/2, height/2, 25, 25);
   }
}