Vector Tools for

Computer Graphics

Computer Graphics
Basic Definitions

 Points specify location in space (or in the plane).

 Vectors have magnitude and direction (like
velocity).

Points  Vectors
Basics of Vectors

v Vector as displacement:
P
v v is a vector from point P to point Q.

The difference between two points is a vector: v = Q - P

Another way:

The sum of a point and a vector is a point : P + v = Q Q

P v
Operations on Vectors

Two operations

Addition Multiplication be scalars

a+b sa
a = (3,5,8), b = (-1,2,-4) a = (3,-5,8), s = 5
a + b = (2,7,4) 5a = (15,-25,40)

operations are done componentwise

Operations on vectors

Addition
b
a+ b a+ b
b
a a

Multiplication by scalar

a
2a

-a
Operations on vectors

Subtraction

a-c a-c
a a a

c -c c
Properties of vectors
Length or size
w = (w1,w2,…,wn)

| w |  w12  w22  ...  wn2

Unit vector
 a
a
a
• The process is called normalizing
• Used to refer direction

The standard unit vectors: i = (1,0,0), j = (0,1,0) and k = (0,0,1)

Dot Product

The dot product d of two vectors v = (v1,v2,…,vn)

and w = (w1,w2,…wn):

Properties
1. Symmetry: a·b = b·a
2. Linearity: (a+c) ·b = a·b + c·b
3. Homogeneity: (sa) ·b = s(a·b)
4. |b|2 = b·b
Application of Dot Product

Angle between two unit vectors b and c

y
c

b ^ ^
θ cos( )  b  c
Φc
Φb
x

Two vectors b and c are perpendicular (orthogonal/normal) if

b·c = 0
2D perp Vector

Which vector is perpendicular to the 2D vector a = (ax,ay)?

a┴
a
Let a = (ax,ay). -a┴

Then
a┴ = (-ay,ax)
is the a
counterclockwise
perpendicular to a.

What about 3D case?

Rotation in 2d

• We want to rotate a 2d vector v counterclockwise by an angle A

• First we determine perp(v), v┴
• Then we scale v by cosA and scale v┴ by sinA and take their sum

v┴

v
v┴sinA A

vcosA
Rotation in 3d
• We want to rotate a 3d vector l counterclockwise with respect to a
3d unit vector r by an angle A, where l and r are perpendicular to
each other
• First we determine the vector u, that is perpendicular to both l and
r and have a length equal to that of l
• So, u = r X l
• Then we scale l by cosA and scale u by sinA and take their sum

* note that, this method is

applicable only in cases
l
usinA A where the axis of rotation
lcosA and the vector which is to be
r rotated are perpendicular to
each other
Orthogonal Projection

• We want to decompose the vector c into two vectors, one along the
direction of a unit vector v and another along perp(v)
• The length of the orthogonal projection of c along v is c.v
(as v is a unit vector)
• Thus the component (or orthogonal projection) of c along v is (c.v)v
• So the component of c along perp(v) is c-(c.v)v

c
v┴

v
c.v
Reflection [13]

n
n

a r a r

θ1 θ2 m -m

e e

r = a - 2 ( a . n) n
• Here m is the orthogonal projection of a along n
• m equals (a.n)n as n is a unit vector
Cross Product

 Also called vector product.

 Defined for 3D vectors only.
i j k
a  b  ax a y az
bx by bz

Properties
1. Antisymmetry: a Χ b = - b Χ a
2. Linearity: (a +c) Χ b = a Χ b + c Χ b
3. Homogeneity: (sa) Χ b = s(a Χ b)
Geometric Interpretation of Cross Product

y
axb
a P1
P3
b

P2

x
z

1. aXb is perpendicular to both a and b

2. | aXb | = area of the parallelogram defined by a and b
Representing Lines [11][12]

Line Ray

2 types of representations:
1. Two point form
2. Parametric representation
Parametric Representation of a Line

y t>1
B
b t=
C 1

t=0

t<0

x
Planes in 3D

 4 fundamental forms
 Three-point form
 Parametric representation
 Point normal form
 Equation
Parametric Representation of Plane

C b

a
Point Normal Form of a Plane

B
 Representations of Plane [13]

A=(0,0,n.C/ nz) C=(C-0)

B=(0,n.C/ ny,0)

{C, n}
Point
{A,C, B} n = (A-C)x(B – C) Normal
Three Point

n
)x
A

,1
=

,0

a
B

(0

nx
=

+
C

a=
a

b
+

ax
b
a=

=
b=

n
A–
B–

Parametric
C
C

{C, a, b}
Equation of a Plane [1][2][3][4]

• ax + by + cz + d = 0 is the standard equation of a plane in 3d

• If sqrt(a^2 + b^2 + c^2) = 1, then it is called the normalized form
• In the normalized form, |d| equals the distance of the plane from
the origin
Y
What about distance
from an arbitrary point?

(x, y) ny
How to convert between
nx equation and the other
p.n P = (px, py) forms?

L
Line-Plane Intersection [8]

• Plane: ax + by + cz + d = 0
• Line: P + tV
• Determine the specific value of t (say t’) for which the equation of
the plane is satisfied, i.e., the point on the line lies on the plane
Line-Line Intersection [5][6][7]

• Four possible cases:

• Coincident
• Parallel
• Not parallel and do not intersect
• Not parallel and intersect
Line-Line Intersection

• L1: P1 + tV1

• L2: P2 + sV2

• Parallel if V1 and V2 are in the same or opposite direction (i.e., the

angle between them are 0 degree or 180 degree)
• Coincident if they are parallel and have at least one point in common
• If they are not parallel, how to decide whether they intersect or not?
Line-Line Intersection

• If they are not parallel, how to decide whether they intersect or not?
• One solution
• Generate three equations for two unknowns
• Solve the first two equations to find a solution
• Check whether the solution satisfies the third equation
• Another solution
• Check whether (P1 – P2).(V1 X V2) = 0
• If lines intersect this condition must hold
• If lines do not intersect, is it sure not to hold?
Plane-Plane Intersection [9][10]

• Intersection is a line
• So we need two points on the line, or one point and the direction
• How to get a point on the intersecting line?
• How to get the direction of the intersecting line?
Plane-Plane Intersection

• How to get a point on the intersecting line?

• Imagine another plane not parallel to any of the given planes, for
example the plane z = 0 (the XY plane)
• Now solve three plane equations to find their common
intersection point
Plane-Plane Intersection

• How to get the direction of the

intersecting line?
• Consider the planes in point-normal
form
• Plane 1: P1, n1

• Plane 2: P2, n2

• n1 and n2 are both perpendicular to the

intersecting line
• So the direction of the line of
intersection is along n1 X n2
Linear Combination of Vectors

Definition
Linear combination of m vectors v1, v2, …, vm:
w = a1v1 + a2 v2 + …+ amvm
where a1,a2,…am are scalars.

Types
Affine Combination Convex Combination
a1 + a2 + …+ am = 1 a1 + a2 + …+ am = 1
Examples:
and ai ≥ 0, for i = 1,…m.
3a + 2b - 4c
Example: .3a + .2b + .5c
(1- t)a + (t)b
Convex Combination of Vectors

v2
a(v2-v1)

v v3
v1
v2
v1
Links

[1] http://www.songho.ca/math/plane/plane.html
[2] http://mathinsight.org/distance_point_plane
[3] https://www.youtube.com/watch?v=gw-4wltP5tY
[4] https://www.youtube.com/watch?v=7rIFO8hct9g
[5] https://www.youtube.com/watch?v=nKVCvY-FW5Q
[6] https://www.youtube.com/watch?v=bJ56Xr9081k
[7] https://www.youtube.com/watch?v=r5DwyBFxD7Q
[8] https://www.youtube.com/watch?v=Td9CZGkqrSg
[9] https://www.youtube.com/watch?v=SoSTdgqknvY
[10] https://www.youtube.com/watch?v=LpardiBTAvU
Links

[11] https://www.youtube.com/watch?v=FlLbI7DB0SM
[12] https://www.youtube.com/watch?v=nZ2mS5M4fcQ
[13] (textbook) Chapter 4, Computer Graphics using OpenGL (2nd edition)
by Francis S Hill, Jr.