CS 398: Introduction to Graphics Programming

Assignment: Geometry


In this assignment, you will implement some basic geometry manipulations that will enhance your understanding of how to process geometry data using linear algebra. By completing this assignment, you will gain practical experience in transformations to manipulate geometric shapes. The assignment consists of multiple tasks, each designed to build upon the previous one and deepen your understanding of geometry processing.

Base code

Once you downloaded the base code from Piazza and started a local web server, click here to open c_geometry.html. Check if you have started a local web server properly if the link is not working. Extend this code to implement the following tasks. All the tasks below should be done in 2D.

Task 1: Generating polygons

Implement a vertex shader to generate regular polygons with gl_VertexID where uniforms.iNumVertices defines the number of sides (i.e., uniforms.iNumVertices == 5 represents a pentagon). Use gl.drawArrays with POINTS, LINES (or LINE_STRIP or LINE_LOOP), and TRIANGLES (or TRIANGLE_STRIP or TRIANGLE_FAN) properly to draw the respective geometries. Draw points, lines, or triangles (i.e., the resulting polygon) when the value of geometryType is 0, 1, and 2 respectively, so that you can cycle through different modes by pressing the up key. Make sure that different types of geometry are clearly visible. Your code should show the result of this task when processingType == 0. By default, you should be able to cycle through the results of Tasks 1 and 2, Task 3, and Task 4 pressing the down key.

Task 2: Affine transformation

Apply Affine transformation to the shape you generated in Task 1 based on homogeneous coordinates and Affine transformation matrices, so that the shape rotates around the point (0.3, 0.3). You need to define the necessary matrices by yourself within the vertex shader (i.e., do not use predefined matrix functions from TWGL). Change the angle of rotation according to iTime to make animation. Your code should show the result of this task when processingType == 0.

Task 3: Composite transformation

Based on your code in Task 2, apply a sequence of translations and rotations to draw connected line segments so that they stay connected regardless of their rotations and the length of each segment stays the same. Change the angles at each vertex according to iTime to demonstrate your result. Hint: You may want to consider the vertex at gl_VertexID == 0 as fixed, and apply transformation to generate the rest of vertices as the joint locations. You should be able to see something like a robotic arm or a tentacle. Your code should show the result of this task when processingType == 1. Use LINE_STRIP in this task.

Task 4: Parametric curves

Draw a parametric curve defined by the control points given in the code. Choose any parametric curve discussed in the lecture and say what you used in your README. Your code should be in the vertex shader. Draw the resulting curve as many lines similarly to Task 1. Increase the number of vertices so that the resulting curve looks smooth. Your code should show the result of this task when processingType == 2. Use LINE_STRIP in this task.

Task 5: Demo

Create something interesting based on what you have implemented in the previous tasks. Your program should go into the demo mode for this task when pressing the space key, and goes back the regular mode by pressing the space key again. Consider adding interactivity, such as user controls to manipulate the geometry or animations, and document any features you implemented. You are free to combine multiple features from different tasks into one (e.g., parametric curves + composite transformation). Your demo should showcase the capabilities of the code you have written.

Submission

The submission process for this assignment is basically the same as the one for Assignment: Warm-up. See Assignment: Warm-up for instructions about how to prepare your submission. If you are doing something extra, be sure to document them in your README.md or README.txt file. If your changes are so radical that your modified program is incompatible with the original specification for each task, you must include a "compatibility mode" that makes the interface behave like the requirements here, or consider creating an entirely separate code.