p5.js frustum() Method
Last Updated :
04 Mar, 2021
The frustum() function in p5.js is used to set the frustum of the camera, thereby changing its perspective.
A frustum is a geometric form that can be obtained by cutting the top of a pyramid. The six planes of the remaining pyramid act as the clipping planes when rendering a 3D view. Thus, anything inside the clipping planes is visible and anything outside the plane is not visible.
Syntax:
frustum([left], [right], [bottom], [top], [near], [far])
Parameters: This function accepts six parameters as mentioned above and described below:
- left: This is a number that sets the camera frustum’s left plane.
- right: This is a number that sets the camera frustum’s right plane.
- bottom: This is a number that sets the camera frustum’s bottom plane.
- top: This is a number that sets the camera frustum’s top plane.
- near: This is a number that sets the camera frustum’s near plane.
- far: This is a number that sets the camera frustum’s far plane.
The below example illustrates the frustum() function in p5.js:
Example:
Javascript
function setup() {
createCanvas(
windowWidth, windowHeight,
WEBGL);
frustum(-2.5, 2.5, -0.6,
0.6, 1.0, 2000);
}
function draw() {
background(200);
orbitControl();
strokeWeight(10);
stroke(0, 0, 255);
noFill();
rotateX(map(mouseY, 0, height,
0, TWO_PI));
rotateY(map(mouseX, 0, width,
0, TWO_PI));
box(300);
}
|
Output:
Reference:https://p5js.org/reference/#/p5/frustum
Share your thoughts in the comments
Please Login to comment...