We continue this pure WebGL tutorial with animation.
The previous post was dedicated to all the function calls necessary to render a simple triangle. In this post, we will animate this triangle and make it rotate around the three axes. The web page used in the previous post must be changed as following:
- Addition of a mechanism to periodically refresh the canvas and manually control the rotation
- Modification of the shader code to include a matrix-based transformation of vertices
- Creation of a function used to pre-compute the transformation matrix
The part about the transformation matrix necessitates some basic linear algebra but should be understandable with high-school level mathematics knowledge.
Refactoring the code
Note that the vertex shader code above…
View original post 1,099 more words