Computer Graphicsnatacha/TeachFall_2010/CSC470/Notes/Lec9A/Vectors_Operations.pdfGeometric Concepts...

Preview:

Citation preview

CSC 470 Computer Graphics CSC 470 Computer Graphics 11

Computer GraphicsComputer GraphicsVectors and Operations Vectors and Operations

CSC 470 Computer Graphics 2

This WeekThis Week

►►Vector ArithmeticVector Arithmetic►►Geometric ConceptsGeometric Concepts►►Points, Lines and PlanesPoints, Lines and Planes►►Exploiting Dot ProductsExploiting Dot Products

CSC 470 Computer Graphics 3

IntroductionIntroduction

►►Why do we need to learn about vectors?Why do we need to learn about vectors?we need to know where objects are positioned we need to know where objects are positioned in the worldin the worldthe size and orientation of the objectsthe size and orientation of the objectshow far the objects are from one anotherhow far the objects are from one anotherhow reflections workhow reflections workhow physics workshow physics workshow light falls on the objectshow light falls on the objects

CSC 470 Computer Graphics 4

IntroductionIntroduction

►►CoordinatesCoordinates2D2D

3D left3D left--handedhanded

►►3D right3D right--handedhanded

y

x

y

x

zy

x

z

We will be using this

one.

CSC 470 Computer Graphics 5

Graphics Graphics MathsMaths by Exampleby Example

Let’s write a program where a cat chases a rat around the screen.

cat

rat

CSC 470 Computer Graphics 6

Graphics Graphics MathsMaths by Exampleby Example

How do we move the cat?

typedef struct{

GLfloat x, y;GLfloat speed;

} animObject;

animObject cat = {100,100,0.05};

and before drawing the cat each loop:

cat.x+=cat.speed;cat.y+=cat.speed;

-mouseChase1.exe

CSC 470 Computer Graphics 7

Graphics Graphics MathsMaths by Exampleby Example

What is the first problem we encounter?

• The cat’s movement has nothing to do with the rat’s location.

• The cat just moves off the screen.

CSC 470 Computer Graphics 8

Graphics Graphics MathsMaths by Exampleby Example

Therefore we need the cat’s movement to be towards the rat.

This can be described as a vector (v).

We can say:

cat.location + v = rat.location

or

v = rat.location – cat.location

(100,100)

(500,400)

v = (500,400) – (100,100)

v = (400,300)

CSC 470 Computer Graphics 9

Vectors, a closer look.Vectors, a closer look.

►►A vector has a length and a direction.A vector has a length and a direction.►►Vectors are expressed in the same way as Vectors are expressed in the same way as

point coordinates.point coordinates.Point (5,10)Point (5,10)Vector (5,10)Vector (5,10)

►►But how are they different?But how are they different?

CSC 470 Computer Graphics 10

VectorsVectors

P = (5,10)

v = (5,10)

A point has a location

A vector has no location

A vector is a path from one point to another.

CSC 470 Computer Graphics 11

VectorsVectors

Q = (8,1)

A vector can be determined by subtracting point coordinates.

v = Q – P

v = (8-1,1-10)

v = (7, -9)

In other words, v tells us how to get from P to Q. (Take 7 steps across and 9 steps down!!)

P = (1,10)

v

CSC 470 Computer Graphics 12

VectorsVectors

Q = (8,1)

P = (1,10)

v

►► DefinitionsDefinitionsThe difference The difference between two between two points is a vector: points is a vector: ►►v = Qv = Q--PP

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

CSC 470 Computer Graphics 13

VectorsVectors

►►Your TurnYour TurnWhat is the vector that goes from P = (9,10) What is the vector that goes from P = (9,10) to Q = (15,7) ?to Q = (15,7) ?►►v = (6, v = (6, --3)3)

What is the resulting point from adding vector What is the resulting point from adding vector v = (9,v = (9,--20) to point P = (1,2) ?20) to point P = (1,2) ?►►Q = (10, Q = (10, --18)18)

CSC 470 Computer Graphics 14

Graphics Graphics MathsMaths by Exampleby ExampleSo now we know:

• cat.location + (400,300) = rat.location

Rather than this:

cat.x+=cat.speed;cat.y+=cat.speed;

Should we write this:v.x = rat.x - cat.x;v.y = rat.y - cat.y;cat.x+=v.x;cat.y+=v.y;

? What would happen?- mouseChase2.exe

(100,100)

(500,400)v = (400,300)

CSC 470 Computer Graphics 15

Graphics Graphics MathsMaths by Exampleby ExampleWhat happened

• The cat’s location was updated to be the location of the rat.

• It moved to the rat’s location in one jump.

• We want it to appear to be moving towards the location.

CSC 470 Computer Graphics 16

Graphics Graphics MathsMaths by Exampleby ExampleEach loop we want the cat to move along

the vector, but not the whole length.

CSC 470 Computer Graphics 17

Vector OperationsVector Operations

►►There are two fundamental vector There are two fundamental vector operations:operations:

you can scale themyou can scale them►►8v 8v ►►if v = (1,2) then 8v = (8,16)if v = (1,2) then 8v = (8,16)

you can add themyou can add them►►v + av + a►►v = (3,4), a = (8,1) then v = (3,4), a = (8,1) then v+av+a = (11,5)= (11,5)

CSC 470 Computer Graphics 18

Vector OperationsVector Operations

►►Scaling a VectorScaling a Vector

v

2v

0.5v

-0.5v

CSC 470 Computer Graphics 19

Vector OperationsVector Operations

►►Adding VectorsAdding Vectors

v

a

va

v+a

v

-a

v-a

CSC 470 Computer Graphics 20

Vector OperationsVector Operations

►► Your TurnYour TurnGiven vector v = (10,20,5) what is:Given vector v = (10,20,5) what is:►►2v, 0.5v and 2v, 0.5v and --0.2v?0.2v?

2v = (20,40,10)2v = (20,40,10)0.5v = (5,10,2.5)0.5v = (5,10,2.5)--0.2v = (0.2v = (--2, 2, --4, 4, --1)1)

Given vector v = (1,1,1) and a = (8,4,2), what is:Given vector v = (1,1,1) and a = (8,4,2), what is:►►v + a, v v + a, v –– a and a a and a –– vv

v + a = (9,5,3)v + a = (9,5,3)v v –– a = (a = (--7, 7, --3, 3, --1)1)a a –– v = (7, 3, 2)v = (7, 3, 2)

CSC 470 Computer Graphics 21

Vector OperationsVector Operations

►►Linear CombinationsLinear Combinationsadding scaled vectors togetheradding scaled vectors together►►8v + 2a8v + 2a

►►DefinitionDefinitiona linear combination of m vectors va linear combination of m vectors v11, v, v22,…,,…,vvmm is is a vector of the form:a vector of the form:w = aw = a11vv11 + a+ a22vv22 + … + + … + aammvvmm

CSC 470 Computer Graphics 22

Vector OperationsVector Operations

►►Linear CombinationsLinear Combinations►►ExampleExample

v = (1,2,3) and a = (1,1,1)v = (1,2,3) and a = (1,1,1)2v + 3a = (2,4,6) + (3,3,3) = (5,7,9)2v + 3a = (2,4,6) + (3,3,3) = (5,7,9)

CSC 470 Computer Graphics 23

Vector OperationsVector Operations

►►Linear CombinationsLinear CombinationsAffine CombinationsAffine Combinations►►Coefficients add up to unityCoefficients add up to unity

in other words the scalars add up to 1in other words the scalars add up to 1aa11 + a+ a22 + … + a+ … + amm = 1= 1

►►e.g. 3a + 2b e.g. 3a + 2b –– 4c (3+24c (3+2--4=1)4=1)►►Forcing an affine combinationForcing an affine combination

(1(1--t)a + (t)a + (t)bt)b

CSC 470 Computer Graphics 24

Vector OperationsVector Operations

►►Challenge QuestionChallenge QuestionThe follow is an affine transformation:The follow is an affine transformation:►►iaia + + jbjb + ?c+ ?c►►what is the coefficient of c?what is the coefficient of c?

►►i + j + ? = 1i + j + ? = 1►►? = 1 ? = 1 –– i i –– j thereforej therefore►►iaia + + jbjb + (1+ (1--ii--j)cj)c

CSC 470 Computer Graphics 25

Vector OperationsVector Operations

►►Linear CombinationsLinear CombinationsConvex CombinationsConvex Combinations►►Coefficients add up to unity…. butCoefficients add up to unity…. but►►all coefficients must be between 0 and 1all coefficients must be between 0 and 1

i.e.i.e.►►aa11 + a+ a22 + … + a+ … + amm = 1 and= 1 and►►1 >= 1 >= aaii >= 0 for all 1,…,m>= 0 for all 1,…,m

e.ge.g►►.9v + .1w.9v + .1w►►.25v + .75w.25v + .75w

CSC 470 Computer Graphics 26

Vector OperationsVector Operations

►►Linear CombinationsLinear CombinationsConvex CombinationsConvex Combinations►►The set of all convex combinations of two vectors, The set of all convex combinations of two vectors,

vv11 and vand v22 is:is:v = (1v = (1--a)va)v11 + av+ av22

as a varies from 0 to 1as a varies from 0 to 1

►►Why?Why?every possible scalar version of vevery possible scalar version of v11 and vand v22 is covered!is covered!

CSC 470 Computer Graphics 27

Vector OperationsVector Operations

►►Linear CombinationsLinear CombinationsConvex CombinationsConvex Combinations►►v = (1v = (1--a)va)v11 + av+ av2 2 can can

be rearranged to be rearranged to give:give:

►►v = vv = v11 + a(v+ a(v22--vv11))►►This shows that the This shows that the

vector v will be vvector v will be v11plus some scaled plus some scaled version of the vector version of the vector joining vjoining v11 with vwith v22

v1

v2 v2 – v1

a(v2 – v1)v

CSC 470 Computer Graphics 28

Vector OperationsVector Operations

►►Linear CombinationsLinear CombinationsConvex CombinationsConvex CombinationsGiven 3 vectors vGiven 3 vectors v11, v, v22 and vand v3 3 the set of linear combinations the set of linear combinations will be:will be:v = av = a11vv11 + a+ a22vv22 + (1+ (1--aa11--aa22)v)v33

v = 0.2vv = 0.2v11 + 0.3v+ 0.3v22 + 0.5v+ 0.5v33

v = 0.5vv = 0.5v11 + 0.5v+ 0.5v22 + 0v+ 0v33

v1

v3

vv22

All values of v will point inside

this region!!

0.2v0.2v11

0.3v0.3v22

0.5v0.5v33

CSC 470 Computer Graphics 29

Vector OperationsVector Operations

►►Linear CombinationsLinear CombinationsConvex CombinationsConvex CombinationsGiven 3 vectors vGiven 3 vectors v11, v, v22 and vand v3 3 the set of linear combinations the set of linear combinations will be:will be:v = av = a11vv11 + a+ a22vv22 + (1+ (1--aa11--aa22)v)v33

v = 0.2vv = 0.2v11 + 0.3v+ 0.3v22 + 0.5v+ 0.5v33

v = 0.5vv = 0.5v11 + 0.5v+ 0.5v22 + 0v+ 0v33

v1

v3

vv22

All values of v will point inside

this region!!

0.5v0.5v11

0.5v0.5v22

CSC 470 Computer Graphics 30

Graphics Graphics MathsMaths by Exampleby ExampleSo rather than add the whole vector to the

cat’s location, we could just add a scaled version of it.

If we take one 500th of the vector each loop:

cat.x+=(v.x/500.0);cat.y+=(v.y/500.0);

The cat will move along the vector.

-mouseChase3.exe

CSC 470 Computer Graphics 31

Vector LengthVector Length

►►MagnitudeMagnitudeis the length of the vectoris the length of the vectordetermined using Pythagoras’ Theoremdetermined using Pythagoras’ Theorem►►can you remember what this is? can you remember what this is?

CSC 470 Computer Graphics 32

Vector OperationsVector Operations

►► MagnitudeMagnitudePythagoras’ TheoremPythagoras’ Theorem►►The length of the hypotenuse of a rightThe length of the hypotenuse of a right--angled triangle is angled triangle is

equal to the square root of the sum of the squares of the equal to the square root of the sum of the squares of the other two sides.other two sides.

a

b

h bah 22 +=

CSC 470 Computer Graphics 33

Vector OperationsVector Operations

►► MagnitudeMagnitudePythagoras’ TheoremPythagoras’ Theorem►►Think of a vector as the Think of a vector as the

hypotenuse of a righthypotenuse of a right--angled angled triangle.triangle.

►►The length of a vector is The length of a vector is denoted using |v|denoted using |v| v

y coordinate

x coordinate

yxv 22|| +=

CSC 470 Computer Graphics 34

Vector OperationsVector Operations

►► MagnitudeMagnitudePythagoras’ TheoremPythagoras’ Theorem►►Example: What is the magnitude of v = (5,10)?Example: What is the magnitude of v = (5,10)?►► |v| = sqrt(5|v| = sqrt(522+10+1022) = sqrt(25+100) = sqrt(125)) = sqrt(25+100) = sqrt(125)►►11.1811.18

CSC 470 Computer Graphics 35

Vector OperationsVector Operations

►► Your TurnYour TurnFind |v| for:Find |v| for:v=(1,v=(1,--2,5), w=(10,3,1) and t=(1,1,1)2,5), w=(10,3,1) and t=(1,1,1)►► |v| = 5.5677|v| = 5.5677►► |w| = 10.488|w| = 10.488►► |t| = 1.732|t| = 1.732

CSC 470 Computer Graphics 36

Vector OperationsVector Operations

►►MagnitudeMagnitudeSince a vector is the Since a vector is the path between to path between to points, then the points, then the length of the vector length of the vector must be the distance must be the distance between the two!!between the two!!

Q = (8,1)

P = (1,10)

v

CSC 470 Computer Graphics 37

Vector OperationsVector Operations

►►MagnitudeMagnitudeSometimes it is useful (as you will see soon) Sometimes it is useful (as you will see soon) to scale a vector so that its length is unity (1).to scale a vector so that its length is unity (1).A normal vector is denoted by a hat: A normal vector is denoted by a hat: ââ..This means dividing the vector coordinates by This means dividing the vector coordinates by the length of the vector. the length of the vector. ââ = a/|a|= a/|a|

CSC 470 Computer Graphics 38

Vector OperationsVector Operations

►►MagnitudeMagnitudeExample:Example:►►What is the normal version of a = (1,5,3) ?What is the normal version of a = (1,5,3) ?►►|a| = sqrt(1|a| = sqrt(122 + 5+ 522 + 3+ 322) = 5.916) = 5.916►►ââ = (1/5.916, 5/5.916, 3/5.916) = (1/5.916, 5/5.916, 3/5.916)

= (0.169, 0.845, 0.5)= (0.169, 0.845, 0.5)

CSC 470 Computer Graphics 39

Vector OperationsVector Operations

►►Your turnYour turnNormaliseNormalise the following:the following:►►a = (2,4,6)a = (2,4,6)►►g = (1,1,1)g = (1,1,1)►►h = (0,5,1)h = (0,5,1)

Answers with gross rounding errors Answers with gross rounding errors ☺☺►►ââ = (0.26,0.53,0.8)= (0.26,0.53,0.8)►►ĝ = (0.6,0.6,0.6)ĝ = (0.6,0.6,0.6)►►ĥ = (0,1,0.2)ĥ = (0,1,0.2)

CSC 470 Computer Graphics 40

Important VectorsImportant Vectors

►► 3 Vectors you should become good friends with:3 Vectors you should become good friends with:►► NormalisedNormalised vectors parallel to:vectors parallel to:

x axis (1,0,0); (called i)x axis (1,0,0); (called i)y axis (0,1,0); (called j)y axis (0,1,0); (called j)z axis (0,0,1); (called k)z axis (0,0,1); (called k)

►►These vectors are called:These vectors are called:

the unit vectorsthe unit vectors

CSC 470 Computer Graphics 41

Graphics Graphics MathsMaths by Exampleby ExampleIn the previous example, the cat moved

towards the rat and it began to slow down because v changed each calculation as the cat got closer to the rat.

NOTE: The length of the vector changed but not the direction.

If we want the cat to move at a constant speed we could use the normalisedversion of v, as we know it would always have a length of 1.

CSC 470 Computer Graphics 42

Graphics Graphics MathsMaths by Exampleby ExampleSo rather than add the whole vector to the cat’s location, we

could just add the normalised version of it.

Therefore we would do this:v.x = rat.x - cat.x;v.y = rat.y - cat.y;v.normalise();cat.x+=v.x;cat.y+=v.y;

wherevoid normalise(){

float length = sqrt(pow(x,2)+pow(y,2));x = x/length;y = y/length;

}

-mouseChase4.exe

CSC 470 Computer Graphics 43

Graphics Graphics MathsMaths by Exampleby Example• The mouse now moves with a constant speed.

It moves a distance of 1 each loop.

• To slow or speed this, we need to incorporate a speed variable.

• Thus:cat.x += v.x * speed;cat.y += v.y * speed;

• We call v, velocityvelocity.

-mouseChase5.exe

CSC 470 Computer Graphics 44

Graphics Graphics MathsMaths by Exampleby Example• Now we have the cat moving towards the rat!!

• What next?

• The cat should turn in the direction it is moving.

• How do we do this?

• Use vectors of course...!!!

CSC 470 Computer Graphics 45

Graphics Graphics MathsMaths by Exampleby Example• We need to determine the angle between the

cat’s initial velocity (v1) and it’s new velocity (v2).

• To do this, we use

the DOT product. v1

v2

Ө

CSC 470 Computer Graphics 46

Vector OperationsVector Operations

►►The DOT ProductThe DOT ProductUsed to solve geometrical problems in Used to solve geometrical problems in computer graphics.computer graphics.Useful in determining the way in which lines Useful in determining the way in which lines and vectors intersect.and vectors intersect.

CSC 470 Computer Graphics 47

Vector OperationsVector Operations

►► The DOT ProductThe DOT ProductCalculated by multiplying and adding row values with Calculated by multiplying and adding row values with column values.column values.DefinitionDefinition►►The dot product of two vectors is denoted vThe dot product of two vectors is denoted v٠٠w and has the w and has the

value:value:

∑=

n

iii wv

1

CSC 470 Computer Graphics 48

Vector OperationsVector Operations

►► The DOT ProductThe DOT Productor where v = (vor where v = (v11,v,v22) and w = (w) and w = (w11,w,w22))the dot product, v the dot product, v ٠٠ w will be:w will be:►► (v(v11ww11+v+v22ww22))

Example, v = (2,1) and w = (3,5) then v Example, v = (2,1) and w = (3,5) then v ٠٠ w will be:w will be:►►2*3 + 1*5 = 112*3 + 1*5 = 11

Example, v = (2,2,2,2) and w = (4,1,2,1.1), v Example, v = (2,2,2,2) and w = (4,1,2,1.1), v ٠٠ w will w will be:be:►►2*4 + 2*1 + 2*2 + 2 * 1.1 = 16.22*4 + 2*1 + 2*2 + 2 * 1.1 = 16.2

CSC 470 Computer Graphics 49

Vector OperationsVector Operations

►► The DOT ProductThe DOT ProductThe angle between two vectors.The angle between two vectors.►►The dot product can be used to find the angle between two The dot product can be used to find the angle between two

vectors or intersecting lines.vectors or intersecting lines.►►Given 2 vectors e and c, the angle between the vectors can Given 2 vectors e and c, the angle between the vectors can

be calculated.be calculated.e = (|e = (|e|cose|cos Өe,|e|sin,|e|sin Өe))c = (|c = (|c|cosc|cos Өc,|c|sin,|c|sin Өc))

►►The dot product e The dot product e ٠٠ c isc is||e||c|cose||c|cos((Өc - Өe)

►or e e ٠٠ c =c =|e||c|cos(Ө) where Ө is the angle between the vectors!

e

c

Өe

Өc

Ө

CSC 470 Computer Graphics 50

Vector OperationsVector Operations

►► The DOT ProductThe DOT Producte e ٠٠ c =c =|e||c|cos(Ө) Divide both sides by |e||c| for a more compact form:►► (e (e ٠٠ c)/|e||cc)/|e||c| =| =|e||c|cos(Ө)/|e||c|►ĉ ٠٠ ê = coscos((Ө )

Therefore:Therefore:►►The angle between two vectors is The angle between two vectors is

the dot product of the the dot product of the normalisednormalised vectors.vectors. e

c

Өe

Өc

Ө

CSC 470 Computer Graphics 51

Vector OperationsVector Operations

►► The DOT ProductThe DOT ProductExample: Find the angle between (5,6) and (8,2)Example: Find the angle between (5,6) and (8,2)►► coscos((Ө ) = ĉ ٠٠ ê ►ĉ = c/|c| = (5,6) / sqrt(52+62)

= (5,6) / 7.8= (5,6) / 7.8= (0.64,0.77)= (0.64,0.77)

►ê = e/|e| = (8,2) / sqrt(82+22)= (8,2) / 8.25= (8,2) / 8.25= (0.8,0.24)= (0.8,0.24)

►ĉ ٠٠ ê = 0.8248►Ө = cos-1(0.8248) = 34.43

c

CSC 470 Computer Graphics 52

Graphics Graphics MathsMaths by Exampleby ExampleTherefore the cat’s turning angle should be:• angle = acos(cat.velocity.x*v.x + cat.velocity.y*v.y);

-mouseChase6.exe

v1

v2

Ө

In the example, the cat seems to be facing the wrong direction.

What went wrong?

CSC 470 Computer Graphics 53

Graphics Graphics MathsMaths by Exampleby ExampleThe angle calculation was correct!

However,

• positive angles in computer graphics turn objects anticlockwise.

How do we calculate a negative angle?

• You can’t!

• How do we know whether to turn left or right?

• Well, not by using the dot product alone.

CSC 470 Computer Graphics 54

Enter the Cross ProductEnter the Cross Product

►►Cross ProductsCross ProductsThe cross product of two vectors is another The cross product of two vectors is another vector.vector.The resulting vector is perpendicular to both The resulting vector is perpendicular to both vectors.vectors.

CSC 470 Computer Graphics 55

Vector OperationsVector Operations

►► Cross ProductsCross ProductsGiven a = (Given a = (aaxx,a,ayy,a,azz) and e = () and e = (eexx,e,eyy,e,ezz) the cross ) the cross product would be (in terms of the unit vectors):product would be (in terms of the unit vectors):►►a x e = a x e = i(ai(ayyeezz--aazzeeyy) + ) + j(aj(axxeezz--aazzeexx) + ) + k(ak(axxeeyy--aayyeexx))►►or if you find it easier you can form a determinant, thus:or if you find it easier you can form a determinant, thus:

eeeaaakji

eazyx

zyx=×

CSC 470 Computer Graphics 56

Vector OperationsVector Operations

►► Cross ProductsCross ProductsHow do you use this to calculate the dot product?How do you use this to calculate the dot product?Take each item in the top row and multiply by the Take each item in the top row and multiply by the difference of the products of the items in the other difference of the products of the items in the other columns.columns.

eeeaaakji

eazyx

zyx=×

CSC 470 Computer Graphics 57

Vector OperationsVector Operations

►► Cross ProductsCross Productsi(ai(ayyeezz--aazzeeyy))j(aj(axxeezz--aazzeexx))k(ak(axxeeyy--aayyeexx))

eeeaaakji

eazyx

zyx=×

Now put them together:a x e = a x e = i(ai(ayyeezz--aazzeeyy) + ) + j(aj(axxeezz--aazzeexx) + ) + k(ak(axxeeyy--aayyexex))…. and you have the CROSS PRODUCT!!!…. and you have the CROSS PRODUCT!!!

CSC 470 Computer Graphics 58

Vector OperationsVector Operations

►► Cross ProductsCross Productsi(ai(ayyeezz--aazzeeyy) + ) + j(aj(axxeezz--aazzeexx) + ) + k(ak(axxeeyy--aayyeexx))

is just another way of writing a 3d coordinate e.g.is just another way of writing a 3d coordinate e.g.((xx, , yy, , zz))

( ( ((aayyeezz--aazzeeyy)), , ((aaxxeezz--aazzeexx)), , ((aaxxeeyy--aayyeexx)) ))

CSC 470 Computer Graphics 59

Vector OperationsVector Operations

►►Cross ProductCross ProductNow we have the cross product what are we Now we have the cross product what are we going to do with it?going to do with it?We can use it to find perpendicular vectors and We can use it to find perpendicular vectors and areas.areas.

CSC 470 Computer Graphics 60

Vector OperationsVector Operations

►►Cross ProductCross Producta x e is perpendicular to both a and ea x e is perpendicular to both a and ethe length of a x e equals the area of the the length of a x e equals the area of the parallelogram bounded by a and eparallelogram bounded by a and eUse the right hand thumb rule to determine the Use the right hand thumb rule to determine the direction of a x edirection of a x e

a

e

a x e

CSC 470 Computer Graphics 61

Vector OperationsVector Operations

►►Cross ProductCross ProductFinding the Normal to a PlaneFinding the Normal to a Plane►►Given three points on the plane we can determine Given three points on the plane we can determine

the normal to the plane.the normal to the plane.►►PP11, P, P22, P, P33 --> v = P> v = P22--PP11, w = P, w = P33--PP11

►►Find v x w to calculate the normal, n.Find v x w to calculate the normal, n.►►Any scalar multiple of n is also normal to the plane.Any scalar multiple of n is also normal to the plane.

CSC 470 Computer Graphics 62

Vector OperationsVector Operations

►►Cross ProductCross ProductWe can also.....We can also.....►►Determine if you need to turn right or left to go from Determine if you need to turn right or left to go from

facing one vector to another.facing one vector to another.

Let’s say a = (1,0,0) and e = (0,1,0)

a x e = (1*0-0*1, 0*0-1*0, 1*1 – 0*0)

= (0,0,1)a

e

a x e

CSC 470 Computer Graphics 63

Vector OperationsVector Operations

►►Cross ProductCross ProductWe can also.....We can also.....►►Determine if you need to turn right or left to go from Determine if you need to turn right or left to go from

facing one vector to another.facing one vector to another.

Let’s say a = (1,0,0) and e = (0,1,0)

e x a = (0*1 - 1*0, 1*0 - 0*0, 0*0 – 1*1)

= (0,0,-1)

a

e e x a

CSC 470 Computer Graphics 64

Vector OperationsVector Operations

►►Cross ProductCross ProductWe can also.....We can also.....►►Determine if you need to turn right or left to go from Determine if you need to turn right or left to go from

facing one vector to another.facing one vector to another.a

e e x a = (0,0,-1)

a

e

a x e = (0,0,1)

What do these results tell you?

CSC 470 Computer Graphics 65

Vector OperationsVector Operations

►►Cross ProductCross ProductWe can also.....We can also.....►►Determine if you need to turn right or left to go from Determine if you need to turn right or left to go from

facing one vector to another.facing one vector to another.

a

e

a x eif we want to turn from facing a to

facing e, then obvious, by looking at it we have to turn to our left.

In this case a x e gives us a resulting

vector with a positive z value.

CSC 470 Computer Graphics 66

Vector OperationsVector Operations

►►Cross ProductCross ProductWe can also.....We can also.....►►Determine if you need to turn right or left to go from Determine if you need to turn right or left to go from

facing one vector to another.facing one vector to another.

a

e e x a

if we want to turn from facing e to facing a, then obvious, by looking at

it we have to turn to our right.In this case e x a gives us a resulting

vector with a negative z value.

CSC 470 Computer Graphics 67

Vector OperationsVector Operations

►►Cross ProductCross ProductTherefore:Therefore:►► if the z value of the cross product is negative then if the z value of the cross product is negative then

we turn clockwisewe turn clockwise►►if the z value of the cross product is positive then we if the z value of the cross product is positive then we

turn counterclockwiseturn counterclockwise

CSC 470 Computer Graphics 68

Vector OperationsVector Operations

►► Cross ProductCross ProductTherefore:Therefore:

double double turnAngle(vectorturnAngle(vector v1, vector v2)v1, vector v2){{

double angle = double angle = acos(cat.velocity.xacos(cat.velocity.x**v.xv.x + + cat.velocity.ycat.velocity.y**v.yv.y) ) * 180/3.14; //convert to degrees* 180/3.14; //convert to degrees

//if z of cross product is negative//if z of cross product is negativeif( (v1.x*v2.y if( (v1.x*v2.y -- v1.y*v2.x) < 0)v1.y*v2.x) < 0)

return return --angle;angle;//if z of cross product is positive//if z of cross product is positiveelse if ((v1.x*v2.y else if ((v1.x*v2.y -- v1.y*v2.x) > 0)v1.y*v2.x) > 0)

return angle;return angle;

//if z is 0 then no turn angle//if z is 0 then no turn anglereturn 0;return 0;

}}--mouseChase7.exemouseChase7.exe

CSC 470 Computer Graphics 69

Let’s move the RatLet’s move the Rat

►►If we program a mouse click to change the If we program a mouse click to change the location of the rat, we would assume the cat location of the rat, we would assume the cat will change directions and move towards it. will change directions and move towards it.

►►This is a great test for our program.This is a great test for our program.

CSC 470 Computer Graphics 70

Let’s move the RatLet’s move the Ratvoid void myMouse(intmyMouse(int button, button, intint state, state, intint x, x, intint y)y){{

//if left button clicked move the rat//if left button clicked move the ratif(buttonif(button == GLUT_LEFT_BUTTON && state == GLUT_DOWN)== GLUT_LEFT_BUTTON && state == GLUT_DOWN){{

rat.xrat.x = x;= x;rat.yrat.y = SCREENHEIGHT = SCREENHEIGHT -- y;y;

}}}}

-mouseChase8.exe

CSC 470 Computer Graphics 71

Homogeneous CoordinatesHomogeneous Coordinates

►►Some graphics systems and OpenGL Some graphics systems and OpenGL represent points and vectors as represent points and vectors as homogeneous coordinates.homogeneous coordinates.

►►This means that in 2D a coordinate has 3 This means that in 2D a coordinate has 3 values (x, y, v) values (x, y, v)

►►and in 3D, 4 values (x, y, z, v)and in 3D, 4 values (x, y, z, v)

CSC 470 Computer Graphics 72

Homogeneous CoordinatesHomogeneous Coordinates

►► For a point v = 1For a point v = 1►► For a vector v = 0For a vector v = 0►► e.g. The point (2,4) becomes (2,4,1).e.g. The point (2,4) becomes (2,4,1).►► e.g. The vector (3,5) becomes (3,5,0).e.g. The vector (3,5) becomes (3,5,0).►► e.g. The point (3,4,1) becomes (3,4,1,1).e.g. The point (3,4,1) becomes (3,4,1,1).►► e.g. The vector (3,6,7) becomes (3,6,7,0).e.g. The vector (3,6,7) becomes (3,6,7,0).►► When it comes to working with the point or When it comes to working with the point or

vector the 1 and 0 can just be dropped.vector the 1 and 0 can just be dropped.►► The reason for this will become clear in later The reason for this will become clear in later

chapters…..chapters…..

CSC 470 Computer Graphics 73

ExampleExample

►► TweeningTweening between shapesbetween shapes

►► -- tween.exetween.exe

CSC 470 Computer Graphics 74

The EndThe End

►►Next week….Next week….RotationsRotationsScalingsScalings andandTranslations…Translations…

Recommended