In this overview of making geometry shapes in three.js we’re going to give you a feel for what your options are and point you in the direction of learning different geometry methods.
In three.js objects that you will see in the 3d viewer are (generally) meshes, and a mesh is made of the combination of a geometry and material. In other words a blue box would be a box geometry shape with a blue surface material. There are lots of terms that are used somewhat interchangeably, but in three.js the terms that matter when programming are “geometry” and “material” combined, equals “mesh”.
Here are the 3 main ways to make geometry in three.js:
- Fully custom geometry where we manually define vertices and faces to form geometric 3d shapes.
- Using the Shape and Extrude classes to define custom shapes and then extrude these shapes to form 3d geometry.
- Using predefined geometric shapes provided by three.js such as Cube, Cylinder.