CS 3110--WebGL Example 7

Track 1 Track 2 Day | Night
AccellDecel
LeftRight
1 2 3 4 Use the arrow keys to drive the car around, and numbers 1 - 5 to change the camera angle.

This example uses attributes for each vertex's position and normal. A uniform variable is used for the colour of the pyramid. The shader is a Phong Shader with one light source. Uniform variables are used to position the light and set up the lighting and material parameters.

OpenGL Shader Variables

• Attribute Variable: variables that describe each vertex. In this example there is an attribute for position and normal.
• Uniform Variable: Variables that are used to describe one or more primitives like Triangles, or Lines. This example uses modelling, viewing, and projection transforms. Uniform variables are also used for the lighting calculation.
• Varying Variables: Variables that are computed in the vertex shader and passed to the fragment shader. Varying variables are interpolated for each fragment. If triangles are being drawn the varying variables are interploated between the calculations for each vertex of the triangle. There are three varying variables in this example: the vector that points to the light L; the normal vector N, and the vector that points to the viewer V.

Code Attribution

• initshaders.js - Dave Shreiner, Graham Sellers, John Kessenich, Bill Licea-Kane
• webgl-utils.js - Google
• HTML and code structure - based on examples by Dave Shreiner, Graham Sellers, John Kessenich, Bill Licea-Kane and Ed Angel