Skip to content
Related Articles

Related Articles

p5.js | noCanvas() Function
  • Last Updated : 29 May, 2020
GeeksforGeeks - Summer Carnival Banner

The noCanvas() function in p5.js is used to remove the default canvas that is created by p5.js. This can be used for sketches that don’t require a canvas. It accepts no parameters.

Syntax:

noCanvas()

Parameters: This function accepts no parameters.

The program below illustrates the noCanvas() function in p5.js:

Example:






function setup() {
  createCanvas(400, 300);
  
  // Create buttons for creating
  // and removing the canvas
  createBtn = createButton("Create Canvas");
  createBtn.position(30, 20);
  createBtn.mouseClicked(createDrawArea);
  
  removeBtn = createButton("Remove Canvas");
  removeBtn.position(30, 50);
  removeBtn.mouseClicked(removeDrawArea);
}
  
function removeDrawArea() {
    
  // Wrap noCanvas() in a try-catch
  // to prevent error in case there
  // exists no canvas to remove
  try {
    noCanvas();
  } catch (e) {
    print("No canvas found to remove");
    print(e);
  }
}
  
function createDrawArea() {
  
  // Create a canvas with the
  // given dimensions
  createCanvas(400, 300);
}
  
function draw() {
  clear();
  background("green");
  textSize(20);
  
  text("This is the canvas area", 50, 130);
  text("Canvas height: " + height, 50, 150);
  text("Canvas width: " + width, 50, 170);
}

Output:

noCanvas-btns

Reference: https://p5js.org/reference/#/p5/noCanvas

full-stack-img

My Personal Notes arrow_drop_up
Recommended Articles
Page :