Skip to content
Related Articles

Related Articles

p5.js noSmooth() Function
  • Last Updated : 18 Feb, 2021

In p5.js all images, fonts, shapes, etc. are set to smooth() by default, except for 3D models, there noSmooth() is active by default. As we know smooth() function smooths the edges of listed elements. So, conversely noSmooth() function restricts smoothing of edges of elements.

Smoothing of edges takes some time. So, If you want to run your p5.js sketch faster and you don’t care much about the visuals. You can use noSmooth() function.

Syntax:

noSmooth();

Parameters: The noSmooth() function does not accept any parameters.

Example 1:



Javascript




function setup() {
  
    // Create canvas of 400X400 px
    createCanvas(400, 400);
}
  
function draw() {
  
    // Set background color to green
    background('green');
  
    // No border to shapes
    noStroke();
  
    smooth(); // by Default
    ellipse(0, 0, 500, 500);
  
    noSmooth();
    ellipse(400, 400, 500, 500);
}

Output: Top ellipse is smooth and bottom ellipse is noSmooth

Example 2:

Javascript




function setup() {
  
    // Create canvas of 400X400 px
    createCanvas(400, 400);
}
  
function draw() {
  
    // Set background color to green
    background('green');
  
    // No border to shapes
    noStroke();
  
    push();
    smooth(); // by Default
    ellipse(100, width / 2, 100, 200);
    pop();
  
    push();
    noSmooth(); // apply noSmooth()
    fill(238, 80, 71); // red color
    ellipse(300, width / 2, 100, 200);
    pop();
}

Output:

My Personal Notes arrow_drop_up
Recommended Articles
Page :