Learn Three.js for 3D Computer Graphics/

...

/

3D Geometries: Polyhedra Shapes

3D Geometries: Polyhedra Shapes

Learn how to create different polyhedra geometries in the Three.js.

We'll cover the following...

The THREE.PolyhedronGeometry

With this geometry, we can easily create polyhedrons. A polyhedron is a geometry that has only flat faces and straight edges. Most often, though, we won’t use THREE.PolyhedronGeometry directly. Three.js provides a number of specific polyhedrons we can use without having to specify the vertices and faces of THREE.PolyhedronGeometry. We’ll discuss these polyhedrons later on in this lesson.

If we want to use THREE.PolyhedronGeometry directly, we have to specify the vertices and the faces. For instance, we can create a simple tetrahedron like this:

Press + to interact
const vertices = [
1, 1, 1,
-1, -1, 1,
-1, 1, -1,
1, -1, -1
];
const indices = [
2, 1, 0,
0, 3, 2,
1, 3, 0,
2, 3, 1
];
new THREE.PolyhedronBufferGeometry(vertices, indices, radius, detail)

Example: Polyhedron geometries

To construct THREE.PolyhedronGeometry, we pass in the vertices, indices, radius, and detail properties (line 13). The ...