p5.js loop() Function

The loop() function is used to call draw() function continuously. The loop() function can be stopped using noLoop() function. Syntax:

loop()

Below example illustrates the loop() function in p5.js: Example:

javascript

let l = 0;

function setup() {
  
  // Create canvas of given size
  createCanvas(500, 300);
  
  // Set the background color
  background('green');

}

function draw() {
  
  // Set the stroke color
  stroke('white');
  
  l = l + 0.5;
  if (l > width) {
    l = 0;
  }
  
  // Function to draw the line
  line(l, 0, l, height);
  
}

function mousePressed() {
  noLoop();
}

function mouseReleased() {
  loop();
}

Output:

Online editor: https://editor.p5js.org/ Environment Setup: https://www.geeksforgeeks.org/javascript/p5-js-soundfile-object-installation-and-methods/

Explore