Question

我有以下这段p5.js代码：

let x = 10;
let y = Math.floor(Math.random()*201);
let x2 = 190;
let y2 = 200 - Math.floor(Math.random()*201);

function setup() {
    createCanvas(200, 200);
}

function draw() {
    clear();
    y = Math.floor(Math.random()*201);
    y2 =  200 - Math.floor(Math.random()*201);
    line(10, y, 190, y2);
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.9.0/p5.js"></script>

我想使其自动运行一次，然后在每次按下按钮时再次运行。

我在这里主要关心的是“只运行一次”，所以如果有人可以帮助我，那就太好了。

提前谢谢！：）

Answer 1

Rabbid76's answer已经是正确的，但以防万一您好奇：您还可以使用noLoop()和loop()函数来控制是否连续调用draw()。

这是一个例子：

function setup() {
  createCanvas(400, 400);
}

function draw() {
  background(220);
  noLoop();
}

function mousePressed() {
  ellipse(mouseX, mouseY, 25, 25);
}

function keyPressed() {
  loop();
}

此代码调用noLoop()函数，以告知p5.js不要连续调用draw()函数。这使您可以用鼠标绘制圆，而不会被背景清除。然后，当按键被按下时，此代码调用loop()函数以再次开始调用draw()。这样会产生背景，然后停止再次连续调用draw()函数。

您可以在the reference中找到更多信息。

我能否使我的p5.js draw（）函数仅运行一次，然后仅在单击按钮时运行？

1 个答案: