How to rotate a vector
Вставка
- Опубліковано 27 лют 2022
- just a quick clip after someone asked a question on twitter~
I'm still working on the sequel to the bézier video! turns out the scope has grown quite large - it's going to be a very long video, but I'm hoping it will be done soon!
💖 Patreon ❱ / acegikmo
🐦 Twitter ❱ / freyaholmer
📺 Twitch ❱ / acegikmo
💬 Discord ❱ / discord
🌸 Instagram ❱ / freya_holmer - Наука та технологія
What about rotating around a pivot?
v' = R(v,θ) this rotates v around the origin by angle θ, as described in the video
v' = R(v-p,θ)+p rotates v around p by angle θ
all it does is, subtract the pivot from the vector, then rotate, then add the pivot!
anyhow, stay tuned for more stuff soon! I'm hard at work on the spline video, a direct sequel to the bézier video! it is, growing, very large and unwieldy ;-; but I hope it will be worth the wait!
love your style.
I've got a request for you!!!
could it be possible to discuss establishing and handling a homography matrix and the fundamental matrix transformations in regards to visual SLAM and or AR applications (in javascript? heehee)
Great explaination..!!!
Can you please make a video on rotating vectors in 3D?
So, is this essentially what 'Unrotate Vector' does in Unreal? I know you can use it to re-orient the characters velocity in terms of its movement rather then it's movement in the world.
It takes in a Vector and a Rotation. The Velocity would be the vector and the characters world rotation would be the Rotation in that example. the result would be x = -600 if your strafing left or x = 600 if you're strafing right....same for forward and backward except on the 'Y'.
In Unreal it just says 'Returns result of Vector A rotated by the inverse of Rotator B' where A is the input vector and B is the input Rotator
what about quaternions could you explaine them the same way
Your visuals and teaching style are amazing. Most math instruction seems like it was designed for people who already know how to “speak math”. You pick a single topic (which just happens to be useful in programming) and explain-with ever-present, beautiful, helpful color-coding -and manage to teach something that I wouldn’t have understood with hours of searching, reading, and trial-and-error.
Thank you 🙏🏽!
This was very neat! A similarly in-depth video of the same in 3D space with quaternions would be even more amazing!
I've been wanting to do that! though as proper edited video rather than a quick recording :)
Hmm, I don't know about quaternions. I know this topic with matrices and the rotation axis vector.
In the video case, is when the rotation vector is (0,0,1). Then in other direction on 3d space, just use another vector.
Quaternions are much different? Looking forward to see the differences of approaches.
A nice exercise is to write down a 2D rotation using quaternions (rotate about z say) and show how it relates to rotation using complex numbers and then (via de moivre’s theorem) to the use of matrices shown here.
@@acegikmo Yes, same way with quats!
@@acegikmo rather than quaternions, try to do about geometric/clifford algebra. that has properties which are superset of quaternions. and geometric/clifford algebra will attract audience from new physics/science background as well, not just old physics/animators.
3:36 yeah, clifford algebra is essentially a different way to write quaternions, but with one suprisingly simple twist which makes it ever more powerful than quaternions.
Brilliant, somehow I never thought of that in therms of separate rotated coordinate space! The best explanation of this I ever encountered, thank you!
I love that I had never thought that by rotating the coordinate space you would gain a cache of the expensive trig functions so that you cold apply the same to a bajillion vertices quickly. Super clever.
@@frollard Yes, that's why we use matrices all over the place. Your GPU is even optimised to do matrix and vector multiplications. The great thing is that you can combine multiple transformations into a single matrix and with a single matrix multiplication you can effectively apply several transformations at once.
In computergraphics we usually use 4x4 matrices. So we extend our 3d space into a what is called homogeneous space. We simply offset out 3d space from the origin into the 4th dimension by one unit. This allows us to represent translation transformation with a matrix which are usually not possible. While it is a bit difficult to envision a 4d homogeneous space, the same thing can be done for 2d space where it's easier to understand, but the concept is the same.
So imagine a 2d space that is offset from the origin by 1 unit in the z direction. When looking at the space along the z direction, you don't see the offset since we have a 2d space and everything is projected orthogonally onto the normal 2d space. However what we can do now is applying a shearing transformation in 3d space which has the effect of moving the homogeneous space around. The third column in our matrix would simply be the offset of our origin. That's because position vectors are now also 3d vectors where the z component is always "1". So when applying the matrix to a vector, the 1 is multiplied by that 3rd column which is simply added to the result and causes an offset. As I mentioned, the same works in higher dimensions and is what we're using in usual 3d graphics.
The usual graphics pipeline of most game engines define the points / vertices of a certain object in local space. An object has a local2world matrix (often called model-matrix) which brings the local space vertices into worldspace. We usually place a camera in the scene which is responsible for actually defining where the view should be positioned in the virtual world. What we do here actually is using the inverse matrix of the camera object (this matrix is usually called view matrix). So we transforming all the worldspace positions into the local space of the camera. Depending on the kind of camera we also want to apply some kind of projection from the 3d space of the camera to the 2d space of the screen (either orthographic or perspective projections). For this the camera has another matrix which is called the projection matrix.
There are some other transformations after that to actually get to screen space, but this is usually done by the GPU itself. The neat thing is the combination of view and projection matrix can be calculated once per rendered frame as it does not change during one frame. For each object that is rendered, we simply combine the model matrix with the already combined "VP" matrix to form the MVP matrix for this object. Now all we have to do is grab all vertices of the object (which are defined in object space) and multiply it by this single combined matrix and as a result we get the positions of the vertices on the projected screen.
That, in a very simplified manner, is how a computer renders a 3d scene. Technically speaking you could say that the camera doesn't really move through the world, since that would is purely virtual. In fact when you move the camera around, the whole world is actually rotating around the fix camera. This is pure relativity at play ^^. From the view of the computer screen it's not the camera or the screen that moves, but the whole virtual world is moved.
I can highly recommend the Linear Algebra series of 3b1b. He also goes into quite some details about the vector / point duality and that the term transformation and the term point can actually be interpreted as the same thing.
Amazing video! I've seen the formula for rotating a vector but always wondered why it was the way it was, and you explained it in just over 5 minutes. I love these short but succinct videos that explain specific topics. Thank you.
I love the intuition gained from these quick videos.
I’ve always just used the matrix form with only a rough understanding - “co,neg-sin then swap” - is how I remember it.
The world needs more math teachers like you.
Thank you! I'm making a game and needed to rotate the movement vector accordingly to the object's rotation. The matrix part was really awesome.
Thanks for this video! I've done enough with sine and cosine that I was aware of their rotational properties and I've done rotations in 3d space before, but I never really understood why sin and cos values were set up in the matrix the way they were. This makes perfect sense.
your color coding was so beautiful and well done it help a lot to identify everything in the video, subscribed!!
I have always stumbled around when it comes to space conversions (and, honestly, all vector math), and this is the first explanation I've seen that intuitively makes sense to me! Thank you so much for this video, seriously!
This video made me unreasonably happy thank you
I knew about rotation and stuff but never looked at it this way.
this opened new options of optimization for me. thank you ❤
Great video! Would love to see more maths related content
most of my recent videos like the bézier video takes a very long time to make unfortunately! but I'm working on it, the next proper video will be on splines, which is turning out to take much longer than I was hoping, haha
Really nice explanation - don't think I've seen it explained this way before!
Another way is to consider a complex vector (x+iy) then multiply it by cis(theta) which will cause a rotation of theta in the argand diagram. Then expand this multiplication and factor out the real and imaginary parts to convert it back into a real vector.
You will get the same result, but perhaps more intuitively you can sub these values in for y=x^2 or any function, where y=xsin(theta) and x=xcos(theta)-ysin(theta), and you will get a rotating parabola or function around the origin.
That is such a elegant way to explain vector rotation! I usually have to redo things involving rotation several times, because I added instead of subtracted something, or multiplied something by the wrong vector, because I just have no intuitive understanding of why the formula is what it is. Hopefully it'll be better from now on!
I suggest taking an introductory course to linear algebra at some university. There are most definitely many video lectures available online nowadays. Taking such a course personally helped me understand how to interpret matrices in general and how to make them do what I need to.
@@stewartzayat7526 Oh I already have. It didn't help much for making matrices more intuitive to me, sadly. But I'm glad to hear those have been helpful to you!
Adding this to my shaders and math playlist. You're a real gem on YT :)
The way you teach this is so easy to understand its like wizardry 😯
You are the best teacher :') I really appreciate that you post this publicly for people like me to learn. Thank you so much!
thank you! pointing out that the two perpendicular vectors basically form the axes of a new (rotated) coordinate system made it click for me for the first time
Love these visual explanations.
Ultra satisfying illustration
this is a really brilliant explanation
its even easier if you know a thing or two about tensors
Could you look up Euler/Rodrigues' rotations? It would be great to have it explained with your great visualizations.
Thank you!
Amazingly informative and clear.
Awesome! Please do another one explaining how atan converts between angles and coordinates, it's really useful!
I had infographic lessons about matrixes and vectors, but it's actually the first time I get how this work !
Thanks so much for this! I just ran into a situation with a randomly generated dungeon that would probably be fixed with exactly this!
Im starting to get the idea that you really do have a video for everything...
Thank you for sharing your knowledge and experience.
More of these, please!
I'm in love with this video, thanks.
This is brilliant.
Thank you so much, i know this and used it oh so many times, but my brain just keeps forgetting it! Ty for the refresher
i love u freya this is amzing
I thought for a while at 0:45 you were drawing the projections, not the axis, and got a little confused but once I figured out what was goin on everything was crystal clear. Thanks for another amazing video
Wish the names sine and cosine were flipped so it were more intuitive to x/y. Copilot, coproducer etc are all the secondary, where on grids you generally derive y from x, making x the primary. Would also make more sense with "sin cos tan" being in the order of xyz. Maybe I'm just too smoothbrain tho
You explain things nicely !
It's the first time these + and - actually make sense for me, thanks
you can do this easily by complex numbers, and multiply by iota to rotate it 90degrees
Explained perfectly
Hey, You did a great job in vector and Trigonometry. Now I am expecting some Matrix related videos.
My god this is so much clearer than when i first learned this
Which is the software you are using as blackboard in your videos?
i always used the rotate vector function without ever thinking about how it actually works, now i do. thx
Awesome, keep ‘em coming please!
god bless, extremely helpful and information video!
Basically, a matrix describes a transformation, and in the matrix you drew at the end, the columns in the matrix are where the unit vectors i (1, 0) and j (0, 1) will end up after the transformation. So a will be where you want the i to land, and b will be where you want j to land. And if you multiply the vector v with that matrix, you will end up with the transformed vector v'.
thank you so much best explanation
I missed this so much !!!!
As someone who has problems with visual memory I have difficulty in dealing with remembering how to multiply matrices. So, when I had a project that required rotating vectors of an STL file, I created a class for polar coordinates that could translate between Cartesian coordinates. I could then translate rectangular coordinates, rotate the polar coordinates then translate back to rectangular. It might be less efficient but it works for me.
thank u so much
you should make a video about transformations in general. translations and rotations. geting vectors and points in different coordinate systems etc
I've considered this! it might happen after the spline video is done :)
it helped a lot. a LOT. thanks so much.
Outstanding!
Hey Freya,
thanks for the instructive tutorial.
The linear transformation with a matrix is clear. But is there an alternative approach? I'm trying to get the same result with the inverse angle function. To do this, I use the asin / acos to take the radians of any vector I want to rotate:
float x = asin(n.x);
float y = acos(n.y);
Then I feed these back into the angle functions and determine the new position with an angle offset:
p.x = sin(x + angle);
p.y = cos(y + angle);
However, if the "angle" is no longer at 0, the whole thing no longer works.
Is there a correct way to do this? Or should I avoid this kind of method?
Thank you.
Amazing video, thank you for sharing this information, very nice example, I appreciate you :)
In love with your vids
ooooh, that's an interesting way to think about it!
The way I did it a few times is to calculate the angle (atan2 my beloved) and the length of the vector that I want to rotate, then just add theta to the angle value, and then convert that back into x,y coordinates. I guess this is more computationally expensive, but may be easier to understand if you just need to make the thing happen lol
It helps, thanks ! ( I still don't get all of it so it looks like a magic trick, but definitely useful )
wow, that really helped!
Good linear algebra lesson
Thank you
Hi, thanks for the video! Would you mind explaining more why we multiply Vx by a and Vy by b? To rephrase, how does performing multiplication "nudge" the original vector by theta? I think I might be missing some fundamental knowledge of multiplication..
in that case it emerges from how vector*scalar multiplication works, it effectively transforms it to that frame of reference, since those vectors are orthonormal
Cheers love, was able to do it 3D and now I just gotta figure out how to do it with quaternions.
Quaternions are probably best thought of as the composition of two reflections. The quaternion reflection formula isn't as well known as rotation, but it's still very simple and can be derived from the quaternion product and the projection operator, and you can use ordinary euclidean geometry (no vectors needed) to derive the relation between rotation and reflection.
Ok, technically _rotations regardless of dimension_ can be thought of as the composition of two reflections. If you have some way to easily represent reflections and compose them, them you can easily do rotations in any kind of space. Do keep in mind though that double reflections generally rotate by _twice_ the angle between the two mirrors.
Wait... _twice?_ Don't quaternions have a weird property where you need to use half the angle and then multiply from both sides? Could it be that this double reflection concept has been baked into quaternions from the start‽
I would really love for you to cover quaternion rotations for 3d programs. Not the deep math behind it, but the concepts that all engines apply for quaternion calculations 😊
I wish I knew about you on my young age. Great job!
Brilliant video, I just wanted to add that the swap of sin and cos isn't some hacky black magic but actually a property of these functions
sin(90+x) = cos(x)
cos(90+x) = -sin(x)
just one of many possible transformations (not sure if its a good word tho)
> ... the swap of sin and cos isn't some hacky black magic but actually a property of these functions...
Thank-you for this.
Thanks
I Have an engineering degree. I have taken multiple linear algebra courses. I even watch 3b1b. But I have never had a good intuition for the rotation matrix until now. Thank you
If you're having trouble understanding this, then 3Blue1Brown's video "Linear Transformations and Matrices" might help. Essentially, you're applying the rotation to the basis vectors (0, 1) and (1, 0), and then "recording" the new x and y of both in the 2x2 matrix.
I wish it was more standard what exactly is used (each time) and how behind this quite simple idea. Took me some time to figure out all things pointing correctly in a clock. Degrees are fitting nicely to 60 seconds: 360/60 steps and 360/12 (12*5 steps for the hours.) Flipping the whole thing and not start at 9.
Statistic is such a funny thing. I have just been given a task, to rotate for Vektor, With absolutely no explanation.😫 And then you pop into my feet.😍. Thank you so much.
Not sure why I'm watching this really, but neat haha :) Guess I can rotate vectors now!
Another way of doing this could be the following:
// First we get the actual angle of the vector we want to rotate
currentAngle = atan(v.y / v.x)
// And now we can apply the rotation we want
x = cos(currentAngle + angle)
y = sin(currentAngle + angle)
rotatedVector = v.Length * (x , y)
Maybe this explanation can be a litte bit more clear for some people rather than using matrices.
But I'm not sure how efficient it is compared to the method shown in the video.
Good video by the way!
I saw the tweet earlier too so I'm glad you closed the loop. Am I right in thinking vx and vy are local x and y values in the constructed coordinate system?
yep! though it can be interpreted both as the local space components of the constructed coordinate system during conversion, but it's also the world space coordinates of the position before rotation
Wouldn't V, Vx, Vy be the coordinates in global world space before rotation? And Vectors a,b be the new basis for a new local space. And V',V'x, V'y be the new coordinates of a point with rotated axes in global space. If V is in a local space whose axes have been rotated theta, then the rotation operation would convert that to global space.
@@matthewpublikum3114 well, yes, exactly!
I was more impressed by your construction of a matrix from just one source vector. Is something like this possible in 3D? I'm assuming it's a different story, or we wouldn't have so many people uploading tangents and binormals to shaders. Great video!
yeah, in 3D space it gets more complicated because there are more degrees of freedom, and not just one plane of rotation. in game engines, you usually supply the normals and the tangents to calculate tangent space, the bitangent being the (somewhat) unique unit vector perpendicular to both
just a suggestion: you could show how the formula looks when multiplying the matrix by the vector. Many of us forget that procedure
Congratulations, you have a very good teaching.
Nifty !
More math i love your content
Ah! brilliant, i was hating rotation matrix before this :)), what about 3D rotations ?
So do we need 2 points in space to find direction before any action in realtime? If it can be only 1 point at a time in same place. When we want to use 1 vector to show its movement direction before any effects. it seems it can not be to make it before any effect on point. shell it can be a like 2 dimension object like circle in space or there are 1 more surface. when first surface 1-2-3-4-5-6.... second one is like (first surface - (1_b>...
Long ago I tried the XNA framework, but got stucked after doing sprite transformation, the collition boxes/points were not updated based on the new sprite size (collitions keep working based on the original sprite size). I got the point where I knew I need some matrix math/calc to have the new collition box points-size-coord updated based on the transformated sprite (or something like that), but was never able to make it work.
Do you/someone here can recommend a video (from Freya or someone else) related to that specific escenario I mentioned ?
Just curious as I got stuck there back then (almost 12 years ago), and I assume newer engines/frameworks probably already take care of that escenario, but well don't want left this world without understanding that, anyways I will google that again my english is a bit better now maybe I find somehing on my own as well, thank you !
Have you ever used Quaternions or Clifford Algebra to do stuff like rotations? In your experience, are matrix transformation the best for the job?
you usually use both quaternions and matrices in games! quaternions for manipulating and compositing rotations, matrices for space transformation
This came up on my recommended, but im a maths student so cheers
Why do we specifically want to multiple the new vectors X coordinate by the right vector and the y coordinate by the left vector? Is it simply because the right vectors first coordinate is based on cos, whereas the seconds first coordinate is sin?
Thanks, this is very cool :)
If you’re multiplying both coordinates by 2 numbers each, won’t the result get you 2 coordinates? how are they combined?
Through addition, in the video she shows this formula v = v.x * a + v.y * b
@@abdurrahmanalyajouri7992 Oh, thanks!
I wish I could draw this elegantly :'c
thanks for the video. very instructive... but I have an unrelated question. which software did you use to write down with your active pen?
photoshop
god you are such a genius and wonderful teacher. can you please make a detailed video on car controller???
I love that you used the "2D cross product" technique of flipping the coordinates and negating one. That is such an underappreciated powerful tool in game dev and graphics :)
The other day I was looking at taking the derivative of the Fourier transform and had a brain melting moment that I think you'll appreciate. It is 100% in line with this video, despite sounding super fancy. Check it out...
e^(ix) = cos(x) +i*sin(x)
The real and imaginary part are: (cos(x), sin(x))
If you take the derivative of that (aka gradient, aka the normal), you get this:
i*e^(ix) = i*cos(x) + i*i*sin(x) = -sin(x) + i*cos(x)
The real and imaginary part are: (-sin(x), cos(x))
The real and imaginary parts flipped and one negated, and it all looks very much like the equations in your video :P
oh that's super neat!
I'm sure you already know this, but for anyone else wondering why this is:
It's because e^(ix) represents a circular motion in the complex plane. It traces out a circle as x increases. The derivative is like the velocity of the point as it goes around the circle, so it's always tangent to the circle. And (remembering our geometry) the tangent of a point on circle is always perpendicular to the radius at that point, hence the vector pointing at e^(ix) will always be perpendicular to it's derivative. That "swap and negate" pattern is characteristic of perpendicularity.
bro has the cleanest diagrams
When I was a kid I used to do this using a way I'm thinking now might be weird, but it was the only math I knew at the time.
I only really knew basic soh/cah/toa I guess, so I think I did something like inverse tan with the vectors x and y to get vector length, and then use the other soh/cah, plugging in the new theta angle and vector length to get the x and y of the rotated vector. And I think it worked? 😅
Is it something similar to this? Just in a more roundabout way?
This only for local space rotation right ? I want to rotate an object around the world with different max amplitude on each axis (x;y;z). Do you have a video that talks about the math there i need to use ?
this is for any space. in 3D it gets a little more complicated, but it's not too different, they both usually use matrices
❤❤
So where the Quaternions come into play?
It has been 7 years since I graduated school. But I just understood trigonometry right now lol
Ah ah... Lol..." I just wake up!" For me is more like... Let me have a coffee and be this functional in 3 days...
Excelent explanation. I guess that will be very useful to rotate things in my project!
Thank you.
So... That spline video coming up anytime soon? ❤
Dec 3rd is the plan!
@@acegikmo Awesome! Can't wait! 👍
What's your notes software you use in your videos ?
Notion, as of late, before that, sublime text
That's straight to the point.. or should I say rotated directly to v'? Bad joke, seriously though, really good explaination. Now I dont need to remember the rotation matrix because I can always figure it out! It's the perpendicular unit vector expressed in cos and sin! If you'd rotate the other way, you'd have (sin x , -cos x) instead, right?