La función dibujar() se llama después de la función setup(). La función draw() se usa para ejecutar el código dentro del bloque hasta que se detiene el programa o se llama a noLoop(). Si el programa no contiene la función noLoop() dentro de la función setup(), la función draw() aún se ejecutará una vez antes de detenerla. Siempre debe controlarse con las funciones noLoop(), redraw() y loop().
Sintaxis:
draw()
Los siguientes ejemplos ilustran la función dibujar() en p5.js:
Ejemplo 1:
function setup() {
// Create Canvas of given size
createCanvas(400, 300);
}
function draw() {
background(220);
// Use color() function
let c = color('green');
// Use fill() function to fill color
fill(c);
// Draw a rectangle
rect(50, 50, 300, 200);
}
Producción:
Ejemplo 2:
function setup() {
// Create Canvas of given size
var cvs = createCanvas(600, 250);
}
function draw() {
// Set the background color
background('green');
// Use createDiv() function to
// create a div element
var myDiv = createDiv('GeeksforGeeks');
var myDiv1 = createDiv('A computer science portal for geeks');
// Use child() function
myDiv.child(myDiv1);
// Set the position of div element
myDiv.position(150, 100);
myDiv.style('text-align', 'center');
// Set the font-size of text
myDiv.style('font-size', '24px');
// Set the font color
myDiv.style('color', 'white');
}
Producción: