Creating a geometry by extruding

Three.js provides a couple of ways in which we can extrude a 2D shape to a 3D shape. By extruding, we mean stretching out a 2D shape along its z axis to convert it to 3D. For instance, if we extrude a THREE.CircleGeometry, we get a shape that looks like a cylinder, and if we extrude THREE.PlaneGeometry, we get a cube-like shape. The most versatile way of extruding a shape is using the THREE.ExtrudeGeometry object.

THREE.ExtrudeGeometry

With THREE.ExtrudeGeometry, you can create a 3D object from a 2D shape. Before we dive into the details of this geometry, let's first look at an example: 03-extrude-geometry.html. The following screenshot taken from the example shows this geometry:

In this example, we took the 2D shape we created in the previous chapter and used THREE.ExtrudeGeometry to convert it to 3D. As you can see in this screenshot, the shape is extruded along the z axis, which results in a 3D shape. The code to create THREE.ExtrudeGeometry is very easy...