Cross Product

How to 3D

Chapter 3: Meshes

Cross Product

A normal is a vector that points away from a surface. In a later chapter, we'll illuminate a surface based on how much its normal points toward a light source. For now, we just want to color a model by its normals. As the model bends, its color will change.

Stick out two of your fingers. These represent two vectors. Take a third finger and make it perpendicular to the first two. This third finger is the normal. We compute this normal vector by taking the cross product of the first two vectors.

The cross product measures the dissimilarity between pairs of components of two vectors. There are three ways that the x-, y-, and z-dimensions may be paired: x and y, x and z, and y and z. The cross product is therefore a 3-vector, comprised of three dissimilarity measures. We compute the cross product as follows:

$$\mathbf{p} \times \mathbf{q} = \begin{bmatrix} p_y \times q_z - p_z \times q_y \\ p_z \times q_x - p_x \times q_z \\ p_x \times q_y - p_y \times q_x \end{bmatrix}$$

The three components of the cross product each tell their own story about the two vectors:

The more that the y- and z-coordinates of the two vectors are dissimilar, the bigger the x-coordinate of the cross product will be. The more the x- and z-coordinates are dissimilar, the bigger the y-coordinate. And so on. Prove this to yourself by dragging around on the red and green vectors in this renderer:

The blue vector is the cross product of the other red and green vectors. What happens to the magnitude of the cross product as the vectors become similar? When are the red and green vectors most dissimilar?

Take this definition and add a cross method to your Vector3 class. Have it accept a that vector as a parameter and return the cross product of this and that. We'll use this method to compute a triangle's normal.

Normals are expected to have a magnitude of 1, but the magnitude of the cross product can be anything. Generally we must normalize the cross product by dividing all the components by the magnitude. That's what the normalize method in Vector3 does.

← SphereFace Normals →