Graphics Matrices

Today’s Lecture Brought to you by the integer 6 and letter ‘K’; 2D and 3D points Matrices Rotations Translation Putting it all together

Wireframes Most things can be represented graphically by using points (square, pyramid, your face…) Draw lines between points to make up a wireframe Currently the fastest way to build worlds (curves were not allowed - too slow!)

2-Dimensional Coordinates x axis y axis ( +, + ) ( +, - ) ( -, - ) ( -, + )

3-Dimensional Coordinates Have an extra dimension! “Comes out of paper” - to and fro This new dimension is referred to as “z coordinate” Gives the point depth Example coordinate: ( 2, 5, -4)

Right-hand/Left-hand Hold out right hand. Extend Thumb, first and second fingers. This is positive direction (thumb pointing towards your face) Use left hand for Left-hand coordinate system. In this class, we use Right-handed coordinate system! (z comes out of paper with increasing numbers)

What does it look like? X axis Y axis z a x i s

New Representation of Points 2D old way: (x, y) 2D new way: 3D old way: (x, y, z) 3D new way: [ ] x y x y z

An Example of Rotation (45 degrees) Question: how does x value “behave” as it increments from 0 degrees to 360 degrees?

Matrix Multiplication Used to change one point to another Good for rotating and translating! Will multiply the point by a matrix to give us another point A matrix is an n x m set of data (can be numbers or functions) n = number of rows, m = number of columns Sound complex? Let’s see!

What does it look like? (2D Matrix)

How do I multiply? My 2D coordinates are (7, 8) =

The X coordinate Multiply, Add, Multipy, Add…… New x coord is: 3*7 + 4*8

The Y Coordinate New y coord is: 7*1 + 9*8

Now in 3D! Our point is (9, -10, 12) New x coord is: 9 * 1 + (-10) * * 3

New y coordinate New y coord is: 9 * 3 + (-10) * * 5

New z coordinate New z coord is: 9 * 4 + (-10) * * 8

More and More! (larger matrices) (Note: have to do this nine times! Here, we are trying to find the upper left value of the new matrix)

Another Pass (Note: here we find the middle (of the nine calculations). This is where the two boxes intersect!)

Using what you’ve learned Now you can rotate wireframes in 2D and in 3D This stuff really is used (most video games, simulations, VR etc…) We can rotate (say, a cube) about the x, y, and/or z axis (demonstration) Must specify the degree or amount of rotation (45 o, 90 o, 123 o, 450 o, etc…)

An Example of Rotation (45 degrees)

2D rotation Matrix  = number of degrees cos (  ) -sin (  ) sin (  )cos (  )

3D rotations Can rotate in 3D space too! Able to rotate around each axis –x axis –y axis –z axis

Rotations around X axis 1 0 cos (  ) sin (  ) -sin (  )

*Rotations about Y axis* 1 0 cos (  ) sin (  ) -sin (  )

Rotations about Z Axis 1 0 cos (  ) sin (  ) -sin (  )

What about all three? There is a need to rotate about more than one axis at a time Must multiply rotation matrices together first before multiplying new points (multiply z-rotation times x-rotation. Then multiply points with this new matrix)

Animation Algorithm (in psuedo-code) Get original points p of object loop rotate all p points by  to create p ’ redraw lines between all points p ’ increment  end loop // remember to keep original points!