Question: Write a WebGL program that displays a cube with colored faces using an orthographic projection. Allow an interactive user to rotate the cube 15 degrees
Write a WebGL program that displays a cube with colored faces using an orthographic projection. Allow an interactive user to rotate the cube 15 degrees about the x and y axes. Use ColoredCube from matsuda/ch07 as a template, and make the following modifications. 1) Replace the cuon-matrix.js functions setPerspective and lookAt by functions setOrtho, translate, and rotate. The viewing volume defined by setOrtho should be chosen so that the cube occupies most of the volume but no clipping occurs. 2) Add buttons labeled 'Rotate x' and 'Rotate y', along with callback functions that redraw the cube with the modified rotation angles. This requires a drawing function that creates the modelview-projection matrix mvpMatrix, passes it to the shader variable u_MvpMatrix, clears the color and depth buffers, and calls gl.drawElements. Also, since this drawing function is called by main() and the button callbacks, several variables must be converted from local to global. Your header comments should include your name, the date, and a description of what the program does. Also, add the line "use strict"; at the top of the JavaScript file. Use the Canvas web page to submit your html and js files.
Step by Step Solution
There are 3 Steps involved in it
1 Expert Approved Answer
Step: 1 Unlock
Question Has Been Solved by an Expert!
Get step-by-step solutions from verified subject matter experts
Step: 2 Unlock
Step: 3 Unlock
