p5.Geometry() method is used to represent 3d objects. It is returned by the loadModel() function and also used internally by the 3d primitive drawing functions.
This function requires p5.dom library. So add the following line in the head section of the index.html file.
Javascript
<script language="javascript" type="text/javascript" src="path/to/p5.dom.js"> </script> |
Syntax:
new p5.Geometry([detailX], [detailY], [callback])
Parameters: detailX and detailY takes the number of vertices on a horizontal surface, callback takes a function to call upon object instantiation.
Available methods in p5.Geometry Class:
|
Sr.no. |
Methods |
Description |
|---|---|---|
|
1. |
computeFaces() |
It used to compute the faces for geometry objects based on the vertices. |
|
2. |
computeNormals() |
It used to compute the smooth normals per vertex as an average of each face. |
|
3. |
averageNormals() |
It is used in curved surfaces to compute the average vertex normals. |
|
4. |
averagePoleNormals() |
It is used in spherical primitives to compute the average pole normals. |
|
5. |
normalize() |
It will modify all vertices to be centered within the range -100 to 100. |
Example:
Javascript
function setup() { // Create Canvas of given size var cvs = createCanvas(400, 300); } function draw() { // Set the background color background('pink'); // Creating rectangle at center of canvas rectMode(CENTER); // Initializing a rect geometry geo = new p5.Geometry( rect(200,150,190,120) ); // Adding text to the geometry figure text('neveropen', 160, 150); } |
- In new p5.Geometry( rect(200,150,190,120)), 200 is used to specify the x-axis, 150 for the y-axis and 190 is the width of the rectangle and, 120 is the height of the rectangle.
- Similarly, in text, 160 is the x-axis position and 150 is the y-axis position with respect to the canvas screen.
Output:
Reference : https://p5js.org/reference/#/p5.Geometry
