
Title:
Cross Product  Interactive 3D Graphics

Description:

For a tilted cylinder we were able to look at and think about what axis to

rotate around. However we usually won't be able to do this. If I gave you two

arbitrary vectors and said quick what's the axis of rotation? Best of luck to

you, I sure couldn't do it. Happily there's an easy way to get the axis of

rotation and it's called the cross product. In three.js you call it like this,

it takes two vectors as its inputs, and the result is put into the vector three

itself. The third vector is in fact the axis of rotation or at least one of

them. The direction is determined by the right hand rule. You wrap your hand

from the first vector, in this case the cylinder to the second vector, in this

case the y axis. This then points along the axis of rotation. If we computed the

cross product of these two vectors in the opposite order we would go from the y

axis to the cylinders vector. And we would get the opposite rotation axis.

Recall how the dot product gives us the cosine between two vectors, the length

of the cross product result is in fact proportional to the sine of the angle

between the two vectors. There is one special case I'm going to point out and

its kind of a headache. If the cross product gives back a vector that is of

length 0 or nearly so then the two vectors are either pointing in the same

direction or in directly opposite directions. You can use the dot product of the

two vectors to figure out which, if they point in the same direction, then

you're done. You don't need to rotate at all. If they point in exactly opposite

directions, then you need to rotate 180 degrees. However, the rotation axis

you'll get back from the cross product is actually 0,0,0, which is no axis at

all. At this point, you basically need to choose some arbitrary axis that is

perpendicular to your vectors and use that for rotation, or just form the

rotation matrix directly. Here for example I use the x axis since I know y is

going to be perpendicular to it. See the additional course materials on a good

way to solve this problem in general. The mathematical notation for a cross

product is this, a big X. The length of the vector produced by the cross product

is equal to the sign of theta, that's the angle between the two vectors, times

the length of A. Times the length of B. The cross product itself is computed by

multiplying neighboring elements of the two vectors' coordinates. For the x

coordinate, we multiply Ay times Bz and then subtract Az times By. For the y

coordinate we multiply Az times Bz minus Ax times Bz. I like to do this kind of

x cross thing here as we did before. So I tend to take this and wrap it around

to this side. So it's Az times Bx, and Ax times Bz. For the last coordinate we

do the same thing, Ax times By minus Ay times Bx. At the end we have a vector

that describes the axis of rotation from one vector to the other. And in fact

this vector will be perpendicular to both of these two. Oh, and one more thing.

If you want to use this vector later you probably going to want to normalize it,

because its length will be pretty obscure.