Real-Time 3D Graphics with WebGL 2 - Second Edition

Normals

Normals are vectors that are perpendicular to the surface we want to illuminate. Normals represent the orientation of the surface and are therefore critical to modeling the interaction between a light source and the object. Given that each vertex has an associated normal vector, we can use the cross product to calculate normals.

Cross-Product By definition, the cross-product of vectors A and B will be a vector perpendicular to both vectors A and B.

Let's break this down. If we have the triangle conformed by vertices p0, p1, and p2, we can define the v1 vector as p1 - p0 and the v2 vector as p2 - p0. The normal is then obtained by calculating the v1 x v2 cross-product. Graphically, this procedure looks something like the following: ...