Mathematics for Computer Graphics

Lecture 3

1
Introduction
• Linear algebra is a branch of mathematics that is fundamental to
computer graphics. It studies vectors, linear transformations, and
matrices.

2
Mathematical Objects

3
Scalar
• Scalar is single number. For example, 24

4
Vector
• A Vector is an ordered array of numbers and can be in a row or a
column. A Vector has just a single index, which can point to a specific
value within the Vector. For example, V2 refers to the second value
within the Vector, which is -8 in the graphic below.

5
Vector
• A quantity characterized by a magnitude and direction
• Can be represented by an arrow, where magnitude is the
length of the arrow and the direction is given by slope of the
line
v = OP = จุดปลาย – จุดต้ น = P-OY
 2
 2 v = 2
Y v= 
1  2

1
P (2, 1) X
2
2
X
Z 2
O (0, 0) 2

A vector in 2D A vector in 3D
6
Vector Addition
• Addition of vectors follows the parallelogram law in
2D and the parallelepiped law in higher dimensions:

1   4   5 
 2  +  5  = 7 
     
3 6 9 
u v u+ v

7
Vector Multiplication by a Scalar
• Multiplication by a scalar scales the vectors length
appropriately (but does not affect direction):

2 1.5  2  3   2  4
1.5   =   = 
1  1.5 1  1.5 2 3 = 6
2 4
8
Subtraction
-v

u
v

-v Inverse vector?

Can be seen as an addition of

1 5 − 4 -v

 4 −  2 =  2 
      u
u v u+ v

9
Matrix
• A Matrix is an ordered 2D array of numbers and it has two indices.
The first one points to the row and the second one to the column. For
example, M23 refers to the value in the second row and the third
column, which is 8 in the yellow graphic below.
• A Matrix can have multiple numbers of rows and columns. Note that a
Vector is also a Matrix, but with only one row or one column.

10
Matrix (Continue)
• The Matrix in the example in the yellow graphic is also a 2- by 3-
dimensional Matrix (rows x columns). Below you can see another
example of a Matrix along with its notation:

11
Computational Rules
1. Matrix-Scalar Operations
• If you multiply, divide, subtract, or add a Scalar to a Matrix, you do so
with every element of the Matrix. The image below illustrates this
perfectly for multiplication:

12
2. Matrix-Vector Multiplication
Multiplying a Matrix by a Vector can be thought of as multiplying each
row of the Matrix by the column of the Vector. The output will be a
Vector that has the same number of rows as the Matrix. The image
below shows how this works:

13
• Here is another example of matrix vector multiplication:

14
3. Matrix-Matrix Addition and Subtraction
• Matrix-Matrix Addition and Subtraction is fairly easy and
straightforward. The requirement is that the matrices have the same
dimensions and the result is a Matrix that has also the same
dimensions. You just add or subtract each value of the first Matrix
with its corresponding value in the second Matrix.

15
4. Matrix-Matrix Multiplication
• Note that you can only multiply Matrices together if the number of the
first Matrix’s columns matches the number of the second Matrix’s
rows. The result will be a Matrix with the same number of rows as the
first Matrix and the same number of columns as the second Matrix. It
works as follows:
• You simply split the second Matrix into column-Vectors and
multiply the first Matrix separately by each of these Vectors. Then
you put the results in a new Matrix (without adding them up!). The
image below explains this step by step:

16
17
5. Matrix Multiplication Properties
• Matrix Multiplication has several properties that allow us to bundle a
lot of computation into one Matrix multiplication. We will discuss
them one by one below. We will start by explaining these concepts
with Scalars and then with Matrices because this will give you a better
understanding of the process.
a. Not Commutative
Scalar Multiplication is commutative but Matrix Multiplication is not.
This means that when we are multiplying Scalars, 7*3 is the same as
3*7. But when we multiply Matrices by each other, A*B isn’t the same
as B*A.

18
b. Associative
Scalar and Matrix Multiplication are both associative. This means that
the Scalar multiplication 3(5*3) is the same as (3*5)3 and that the
Matrix multiplication A(B*C) is the same as (A*B)C.

19
c. Distributive
Scalar and Matrix Multiplication are also both distributive. This means
that 3(5 + 3) is the same as 3*5 + 3*3 and that A(B+C) is the same as
A*B + A*C.

20
4. Identity Matrix
• The Identity Matrix is a special kind of Matrix but first, we need to
define what an Identity is. The number 1 is an Identity because
everything you multiply with 1 is equal to itself. Therefore every
Matrix that is multiplied by an Identity Matrix is equal to itself. For
example, Matrix A times its Identity-Matrix is equal to A.
• You can spot an Identity Matrix by the fact that it has ones along its
diagonals and that every other value is zero. It is also a “squared
matrix,” meaning that its number of rows matches its number of
columns.

21
We previously discussed that Matrix multiplication is not commutative but there
is one exception, namely if we multiply a Matrix by an Identity Matrix.
Therefore, the following equation is true: A*I = I*A = A
22
 Inverse
• First of all, what is an inverse? A number that is multiplied by its
inverse is equal to 1. Note that every number except 0 has an inverse.
If you multiply a Matrix by its inverse, the result is its Identity Matrix.
The example below shows what the inverse of Scalars looks like:

23
• The image below shows a Matrix multiplied by its inverse, which
results in a 2-by-2 identity Matrix.

24
Transpose
• And lastly, we will discuss the Matrix Transpose Property. This is
basically the mirror image of a Matrix, along a 45-degree axis. It is
fairly simple to get the Transpose of a Matrix. Its first column is the
first row of the Matrix Transpose and the second column is the second
row of the Matrix Transpose. An m*n Matrix is transformed into an
n*m Matrix. Also, the Aij element of A is equal to the Aji(transpose)
element. The image below illustrates that:

25
26
Mathematics Application in Computer
Graphics……..
• Scalars:
• Color Representation: Scalars are used to represent color intensities
in computer graphics. Each pixel on a screen is typically represented
by three scalar values: red, green, and blue (RGB). By combining
different scalar values, a wide range of colors can be generated.
• Opacity: Scalars can also represent opacity or transparency of
objects. A scalar value ranging from 0 (fully transparent) to 1 (fully
opaque) is assigned to each pixel or object, determining how much
light can pass through it.

27
Mathematics Application in Computer
Graphics…….
• Utilization of Vectors:
1.Motion and Animation: Vectors are used to represent velocities,
accelerations, and forces acting on objects within the game. For
instance, when a spaceship moves through space, its velocity is
represented by a vector indicating both speed and direction.
2.Light and Shadow: Vectors are employed to calculate lighting effects
and shadows in the game. By defining the direction and intensity of
light sources as vectors, the team can accurately simulate how light
interacts with various surfaces and objects.

28
Mathematics Application in Computer
Graphics……….
• Utilization of Matrices:
1. Transformation of Objects: Matrices are employed to transform
objects in 3D space. For instance, when a spaceship needs to be
rotated or scaled, transformation matrices are applied to its vertices
to achieve the desired effect.
2. Projection and Viewport Mapping: Matrices are utilized for
perspective projection and viewport mapping, enabling the
conversion of 3D scenes into 2D images displayed on a screen. By
applying projection matrices, the team ensures that objects farther
away appear smaller, creating a sense of depth and realism.

29