我可以让我的 p5.js draw() 函数仅运行一次，然后仅在单击按钮时运行吗？

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的答案已经是正确的，但以防万一您好奇：您还可以使用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()连续调用该函数。

您可以在参考中找到更多信息。