Showing Revision 2 created 05/24/2016 by Udacity Robot.

1. Title:
   Angle of Rotation - Interactive 3D Graphics
2. Description:

3. 120 0:00 - 0:05
   I have my axis of rotation. It's negative X, Z. It's a good idea to normalize
4. 4912 0:05 - 0:09
   this, but this will do for now. If I look at my cube, it's pretty easy to figure
5. 9006 0:09 - 0:13
   out the diagonal directions themselves. Here is the easiest one. It goes from
6. 13080 0:13 - 0:18
   negative one, negative one, negative one to one, one, one. So the cylinder's
7. 17850 0:18 - 0:22
   axis is (2,2,2). We can also this vector's length to find the distance from one
8. 22139 0:22 - 0:26
   corner to another. These are the facts we need to continue. We've got the axis
9. 26298 0:26 - 0:31
   of rotation. We need the angle to rotate and the length of the cylinder itself.
10. 30773 0:31 - 0:36
    Here's three JS code that computes the cylinder's length. Three JS uses a class
11. 35960 0:36 - 0:41
    called Vector3. What you put in a vector 3 a point or a vectors coordinate is up
12. 41160 0:41 - 0:45
    to you. Perhaps a better name might have been coordinate 3 but that' pretty
13. 44826 0:45 - 0:49
    bulky most graphic systems you'll encounter will call coordinates vectors but
14. 48578 0:49 - 0:52
    it's easy enough to understand from the context what is meant. To find the
15. 52138 0:52 - 0:56
    cylinders axis direction and length I set up the 2 corner locations I then
16. 55920 0:56 - 1:01
    subtract one vector from the other using the sub vectors method. Giving a vector
17. 60591 1:01 - 1:04
    from one point to another. There are a huge number of vector and matrix
18. 64441 1:04 - 1:09
    operations supported in 3JS, subtraction is just one of many. Once we have the
19. 69073 1:09 - 1:13
    cylinder axis, this last line of code computes the length of this axis, which
20. 72977 1:13 - 1:17
    we'll need for knowing how long to make the cylinder. At this point, we have the
21. 77219 1:17 - 1:21
    axis of rotation The length of the cylinder, but we don't have the angle of
22. 81428 1:21 - 1:25
    rotation yet. However, we have everything we need to get it. Given this
23. 85132 1:25 - 1:30
    cylinder's access, we can dot product it with the y axis, which is where the
24. 89968 1:30 - 1:34
    cylinder starts at, and then, by the dot product of that and its final
25. 94414 1:34 - 1:40
    position... We will get the angle that we need to rotate. Remember that the dot
26. 99772 1:40 - 1:43
    product computes the cosine of the angle between two normalized vectors. So we
27. 103428 1:43 - 1:48
    normalize the cylinder's axis here and takes its dot product with the y axis
28. 108279 1:48 - 1:53
    vector here. This gives us the cosine of the angle. So we take the arc cosine to
29. 112708 1:53 - 1:58
    get the angle back in radiants. Using a dot product is a bit of overkill, by the
30. 117526 1:58 - 2:02
    way. Computing a dot product with a y axis like this is the same as just
31. 121964 2:02 - 2:07
    grabbing the y component of the cylAxis. We could've simply normalized and done
32. 126502 2:07 - 2:10
    this like this code here. However, unless this is a critical loop, like we're
33. 130264 2:10 - 2:15
    making a billion of these ornaments, I'd recommend using this first way. If
34. 134748 2:15 - 2:18
    someone reads or modifies this code in the future, the intent is clearer and
35. 138465 2:18 - 2:22
    more general. Now we have all the facts we need to make this object, the axis
36. 142240 2:22 - 2:26
    and angle of rotation and the length of the cylinder. So let's get cracking.
37. 146415 2:26 - 2:29
    Well, I guess I should mention that the sign of the theta might be a little bit
38. 149442 2:29 - 2:33
    questionable here. We could use the right had rule to make sure we have the
39. 152676 2:33 - 2:38
    direction of rotation right. Or we could use the principle of negate and try
40. 157546 2:38 - 2:42
    again. I learned about this practice long ago from an article in an old trade
41. 162164 2:42 - 2:46
    journal called SGI Insider. It was great to realize that someone else was doing
42. 166458 2:46 - 2:51
    what I also do. If I put a rotation in and it goes the wrong direction, just try
43. 170535 2:51 - 2:55
    the opposite. So feel free to do the same, as you're in good company. You could
44. 174832 2:55 - 2:59
    spend 15 minutes trying to figure out the sign needed after some set of matrix
45. 178608 2:59 - 3:02
    operations, and still have about a 50 percent chance of getting it right.
46. 182302 3:02 - 3:07
    Faster, more reliable is just to try it and see. That said, this practice won't
47. 186954 3:07 - 3:11
    help much if there are too many things to negate or if the rotation is part of a
48. 190671 3:11 - 3:15
    long chain of transforms. Or if you're starting from an incorrect algorithm.
49. 194815 3:15 - 3:19
    But, if you're feeling the math is solid, go ahead and just do it. Using this
50. 199111 3:19 - 3:23
    principle with my test program, I found I needed to negate the angle to move the
51. 202946 3:23 - 3:26
    rod to the correct place. I guess I could've thought it through and realized
52. 206456 3:26 - 3:30
    this is the right-hand rule, and all that kind of stuff, but nonetheless, just
53. 209848 3:30 - 3:34
    trying it made me realize we need to. To have a negative theta. I don't really
54. 214028 3:34 - 3:38
    like negative angles, I like to think positively, so I negated both the angle
55. 218444 3:38 - 3:42
    and the axis direction. This should give exactly the same rotation. If you
56. 222430 3:42 - 3:47
    rotate clockwise around one axis, rotating counter clockwise around the opposite
57. 227470 3:47 - 3:50
    axis' direction is the same thing.