Point Light Example

Vertex Shader Processes Lighting

Swipe to Spin the Shaded Cube

View this simplified example of a
point light on a cube.
The vertex shader calculates lighting.
The cube is mapped with a solid color blue.
Lighting helps define the shape of the cube.
Light location, light color, and ambient
color are all declared with constants in the
vertex shader, to keep this example simple.
See the
Point Light Tutorial
with source code.

Seven Thunder Software created a cube in 3DS Max then exported as a DAE file with normals.
The JavaScript
DAE Translator
to converted DAE data for use with WebGL.
The JavaScript for this example uploads an attribute with normal coordinates per vertex.
Each animation frame uploads a normal matrix.
The normal matrix is a 3 x 3 matrix derived from
the inverted and transposed model matrix.

As the cube spins and moves, both a model matrix
and a normal matrix are uploaded.
The vertex shader uses the normal attributes
and normal matrix to compute lighting per frame.