Game Development Reference
In-Depth Information
Building a World
This chapter explains the components of a Three.js scene in detail, including
the different kinds of renderers, geometries, materials, and lighting. We will
also build a procedurally generated city.
Geometries
Geometries are instances of
THREE.Geometry
that define the shape of an object in
a scene. They are made up of vertices and faces (which are themselves objects and
are accessible through the
vertices
and
faces
array properties). Vertices are the
THREE.Vector3
objects representing points in three-dimensional space, while faces
are the
THREE.Face3
objects representing triangular surfaces. (All more complex
shapes are subdivided into triangular faces for rendering purposes.)
Luckily, dealing with vertices and faces directly is usually unnecessary because
THREE.Geometry
has many subclasses that help create commonly used shapes.
3D primitives
Three.js provides a number of classes that generate common shapes. The official
documentation for each type is available at
http://threejs.org/docs/
, but a
summary of common types is shown in the following table (some obscure, optional
constructor parameters were omitted):
Type
Constructor
Description
THREE.CubeGeometry(width,
height, depth, widthSegments =
1, heightSegments = 1,
depthSegments = 1)
Cube
It is a rectangular box with
the specified dimensions. The
segments
parameters split the
sides into smaller rectangles.