p5.js perspectiva() Método

La función de perspectiva() en p5.js se usa para definir una proyección de perspectiva para la cámara en un boceto 3D.

Los objetos que están cerca de la cámara aparecen en su tamaño real, mientras que los que están más lejos de la cámara aparecen más pequeños que el tamaño real. Esto se conoce como escorzo. Los parámetros de esta función definen un volumen de visualización con forma de pirámide truncada. El campo de visión, la relación de aspecto, los planos de recorte cercanos y lejanos se pueden configurar utilizando los parámetros dados.

Sintaxis:

perspective([fovy], [aspect], [near], [far])

Parámetros: esta función acepta cuatro parámetros, como se mencionó anteriormente y se describe a continuación:

• fovy: Este es un número que define el campo de visión vertical frustum de la cámara visto de abajo hacia arriba. Este es un parámetro opcional.
• aspecto: Este es un número que define la relación de aspecto frustum de la cámara. Este es un parámetro opcional.
• cerca: Este es un número que define la longitud del plano cercano del tronco. Este es un parámetro opcional.
• far: Este es un número que define la longitud del plano lejano frustum. Este es un parámetro opcional.

El siguiente ejemplo ilustra la función de perspectiva() en p5.js:

Ejemplo:

function setup() {
  createCanvas(600, 400, WEBGL);
}
  
function draw() {
  background(175);
    
  // Map the fov to the mouse x-axis
  let fov = map(mouseX, 0, width, 0, PI);
  let cZ = (height/2.0) / tan((PI/3)/2.0);
    
  // Set the perspective to the fov
  perspective(fov, float(width)/float(height),
              cZ/10.0, cZ*10.0);
    
  ambientLight(255);
    
  rotateZ(frameCount * 0.02);
  rotateX(frameCount * 0.02);
  
  noStroke();
  normalMaterial();
  box(100, 100, 100);
    
}

Producción:

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