Intro to Graphics 06 - 3D Transformations

thank you for joining to uh another lecture um so last time you'll remember we talked about transformations uh today we're gonna continue uh our discussion of transformations and we're gonna continue with 3d affine transformations uh and then we're going to go into viewing and all that stuff 3d is not going to be too hard actually 3d is going to be just a extension of what we covered in 2d so when we think about fine transformations we said that we can represent them using a matrix actually specifically a 3x3 matrix in 2d using homogeneous coordinates in 3d we're going to have a 4x4 matrix instead of it because in 3d we're using homogeneous coordinates that means we have an extra extra coordinate so that we can do the trek that we did with with translation uh so in 3d we're going to get a four by four matrix uh the first three are going to be x y and z coordinates and uh the last one is going to be what we what we typically call it as the w coordinate but it's the the additional coordinate the fourth coordinate right and if you look at these matrices i'm writing the bottom part as zero zero zero one right so and this one was zero zero one so we're not changing the last row all right well now let's see what our transformations will look like um and i'm going to start with the the simplest one scale simplest one is scale so it's like an identity matrix multiplied by some value so this was our scale matrix in 2d and our scale matrix in 3d is going to be very similar we just have a third row right translation again very simple remember we're putting the translation values over here in 3d we're putting the translation values right here it's the same thing it's just x y z instead of just being x y very very simple right okay so rotation now in in 2d when i have a an object um i can rotate it like like clockwise like this or i can rotate it as um i can rotate it counterclockwise right but nonetheless the rotation is always happening in in this plane right so if you look at the axis of rotation the axis of rotation is always the same yeah i'm mowing it right or left clockwise or counterclockwise but i always rotate it around the same axis in 2d because i don't have another axis to rotate anything around but when we go to 3d things are going to be a little bit different in 3d i have i can rotate things in various ways so i can rotate this object around the x-axis in which case it will look like this i can rotate it around the y-axis i can or i can rotate it around the z-axis right these are very very different rotations and we kind of need to figure out a way to cover all three of them actually we can take an object and rotate it around any given vector in any random axis it doesn't have to be just one axis so i'm pretty sure when you look at these three um it you can tell that they're rotation around x rotation and y rotation around z this one is a little tricky to see but it's actually rotation around this this vector that i'm showing here and if you don't believe me let me rotate it around uh so you can see if you look directly from from that axis uh you can see it it's rotating around it all right now that i hope you believe me uh i'm gonna tell you something interesting actually so rotation around this this any axis concept might sound sort of complicated and scary and it might be but the nice thing about it is i can represent rotation around any given axis as a combination of rotations around x y and z axes so given any vector and the rotation around that vector can be decomposed into three rotations one around that's one around y and then one around it now i'm not telling you exactly how to do this um that part is a little mathy it's actually possible someone gives you an axis and a rotation angle you can actually construct the matrix and you can construct the you can get the rotations around x y and z but it's it's a little mathy so i'm i'm gonna show you how how it how it all comes together but i'm not gonna tell you how to decompose it in three pieces nonetheless it's important i think for you all to understand that this is possible right given a rotation around any random axis i can decompose it into these three rotations all right let's take a look at what these three rotations look like so these are going to be our fundamental functions for rotation in 3d so now look at this one rotation around z-axis so this is the one that looks very much like what we had before right it's the same matrix except that i have this additional column here and i have this additional row uh except for that it is it is going to be uh it is going to be the same thing right and and this is not surprising because you know the rotation axis is still the same axis if we were rotating around the sort of an axis that was perturbing out of the 2d plane and we're sort of doing something very similar right the rotation is around the z-axis that's outside of the x-y plane and that's why this matrix looks very much like the other one uh and these other two look very similar too uh so whichever axis i'm rotating around that axis remains unchanged so if you look at over here the one that is probably the most familiar to us you see that the z value uh because this row is 0 0 1 0 it means the z this matrix does not change the z value which makes sense because i'm rotating around the z axis and only x and y values are supposed to change right and the z values are not supposed to change by rotation around z axis and the same applies to rotation around y axis if i'm rotating around y axis the y values are not supposed to change if i'm rotating around x axis the x values are not supposed to change right so that's why those rows are very simple like just a copy from the identity matrix and the others are just rotations from you know the components of the rotation matrix very simple stuff right the only complication here is the fact that we have three different rotation bases instead of just having one um so if you look at what a rotation around an arbitrary axis would look like uh so this resulting formulation here is a little bit complicated right so if you can decompose this into rotations around first x and then y and then z right in this order i'm going to keep repeating this because this is this is very very important uh i first apply x and then y and then z so i first multiply by this matrix and then the next one and then the next one right uh so when i do rotation in this form i get this formula so if i want to do if i if i know how to decompose my rotation around the given axis into three rotations i can write this matrix like this uh again yo i just wanted to show you that this this kind of looks a little complicated if you actually write it as an equation that that directly comes from the direction of the axis and the rotation angle it becomes it looks a bit more complicated uh but conceptually these are very simple things so i don't necessarily need you to memorize these formulas or anything that's why i'm not going into the details of it but suffice it to know i think for you uh that this this exists you can do this right uh and you can easily look up the formula if you're if you ever need it uh so let me continue talking about rotation matrices a little bit more uh so as i said we're we're drawing rotation around uh around a particular in a particular order so in this case i'm rotating around x and then y and then z right uh so um this is not the same thing as doing doing rotations with the same angles around the same axis in a different order so if i first rotate around x and then z and then y i'm going to get a very different rotation even though i'm using the same angles for each axis right so this these two are not the same and of course it's not the same as this these are not the same as there's not the same as this it's not the same as this so i i have six different versions that the the way that i can uh combine them together and they are going to be different now given a a rotation around any axis so around any any arbitrary axis i can decompose it into any one of these right but i the the the rotation angles that i'm going to get are going to be different for them to represent the same rotation right if you're using the same rotation values for each axis then they're not going to be they're not going to be the same and remember again repeating multiplication order right we first applied this one and then this one and then this one now this is going to come up and a lot of you are going to make mistakes on this that's why i'm repeating it again you know the matrix on the right is the first transformation that is applied and then next one and then next one in this order okay well hopefully uh fewer of you will make that mistake now so we're good okay the last thing we're going to do about transformations is going to be about b-ring so here's what i mean uh in 3d i have an object some object whatever and what i would like to do is to create an image of that object right so that's the rendering process uh the output of rendering is going to be is going to be this some image from some some view angle that i'm looking at this object now you can think about this as like i'm looking at this this object through some some some display right and i'm seeing it and this is the image that i see when i look at it and that's going to appear on my screen and whatever is behind the screen is just a virtual environment all right um so uh the way to think about this is now i'm talking about this in simpler terms things are going to get a bit more complicated later on uh so imagine that there is a virtual environment behind this display and that's what i'm going to be seeing on my display like i have something some character some scene whatever it can it can be animating of course but animation we're gonna get there we don't we don't care about animation just yet just just just freeze this guy all right just stop uh so um what i would like to do is that i would like to know what it will look like on this display right i have this this 3d object and what it will look like on this display that's going to be the rendering operation at the end of it i'm going to get a raster image that represents this and the way i'm going to do this is that i'm going to take this this this object the entire scene and i'm going to project it towards my screen now you can think about it that way longer i'm just going to flatten it so when i do that i'm going to get an image that looks something like this all right so that's the that's the the main idea so i'm just collapsing the the scene so that i'm going to be getting an image an image of a representation of this now these are these are all conceptual it doesn't mathematically that's not exactly what we're doing we're still keeping the the third dimension uh alive we're not destroying it completely but conceptually that's that's what we're we're trying to do okay um so to be able to do this what we need to do is to define a coordinate frame that will represent this environment right so if i can transform my my scene into into this coordinate frame uh that represent this this view volume uh that contains my scene then i can just collapse it in in this direction somehow and get my final image right that's that's what i'm going to be using it for so um let's define a coordinate frame okay um what's the most sensible place for placing um my origin i'm gonna say that the center of my display right it's it's just a sensible location right so center of my display that's where i'm going to have my origin okay um so what's the where where should my x coordinate be i i'm looking at this right so x coordinate should probably be this way right from left to right that kind of makes sense so right this is going to be my x-coordinate and probably my y-coordinate should be up then so it's like when i look at a 2-d when i look at a 2-d image its x-coordinate will be this way and its y coordinate will be this way and it's like i'm looking at a 2d image does that make sense now when we're looking at raster images oftentimes we pick the y coordinate as like the opposite going this way because we like to start from uh the top left corner um so y coordinates sometimes um is flipped but yeah this is a more natural thing to do like the x is left y is out when we're drawing a graph on on screen that's what we would like to see so if this is x and this is why using right handed coordinate system my z coordinate is defined for me now my z coordinate has to be this one right so the funny thing is that in in this form my entire scene will have negative z values because my origin is here everything behind my screen is going to have negative z values and moving away from my view means going into more and more negative values okay i mean this you see where this is coming from right so this is coming from how i pick x and y coordinates because i want this to be analogous to dealing with 2d images or anything 2d graphics basically so the z coordinate sort of is automatically defined for me okay so this is my this is my coordinate frame uh and uh and i'm going to call this and i'm going to call this this coordinate frame my um my camera space or view space so when i refer to camera space or view space i'm talking about a coordinate frame very much like this so when i when i look at it x is this way y is up and z is sort of going pointing behind me uh and the nice thing here is uh is that now i can collapse my scene in the z direction and that's going to give me the image that i want right and the part of the scene that i can see over here that the the virtual stuff that i can see is going to be contained in a volume and i'll call it the v volume all right the v rolling represents the part part of the scene that i i can see now now there might be things behind me in a visual world or some someplace else i won't be seeing them i'm only going to be seeing the part of a scene that is contained inside this v volume right i'm not going to see anything else okay uh so let's see how we get there and how we use this concept uh we're gonna start with viewing transformations uh so i we talked about this briefly last time when i'm building a scene i'm gonna be building it out of multiple models in this case i have a chair model and i have a table model and these models are defined in their own model space or object space so they're just designed in some space where they have a coordinate frame representation to to uh to identify what all any of these make vectors representing this model meaning so what i'm going to have to do is i'm going to take these objects and i'm going to transform them into certain positions and orientations or rotations so i'm going to apply rotations translations and scale basically alpine transformations to move them into where they're supposed to go in the scene that i'm building so i'm going to have a a scene space or a world space that is going to contain these these objects with a different containing a different uh coordinate frame right so how do you do this if you ask well you do this by applying a model transformation and that's going to be just multiplied by a transformation matrix now how do i decide what that transformation matrix is supposed to be well it's i don't know you're designing your scene you're picking these objects and putting them somewhere so you know wherever you're putting them you need to use the the the corresponding transformation matrix that represents that that transformation so there's no one answer to this like you you can't this is like a custom process i'm i'm designing this scene and and this is the way that i'm designing the scene so there you know when you're using um any off-the-shelf software that will allow you to take an object and move it around and rotate it and scale it and when you do that the the software is going to compute the the transformation matrix under the hood and then and then it's going to apply that transformation matrix to to form this this e right but of course it could be just showing you the rotation translation and scale so now this is the part that's sort of related to the our next project project two uh we're going to be doing something very much like this but we're going to be doing this in 2d right we're going to be given translation rotation and scale values and we're going to be forming our c with those values so that was one part of the project all right so this is my this is my scene now uh next let's uh go towards viewing transformation now if i want to have viewing transformation i want to sort of um take this world space or scene space and convert it into convert it into a space that is going to be uh similar to the view space that i talked about a few slides ago so i'm going to figure out i'm going to need to define where i'm going to be observing the scene from right so one way to do that is just to put a camera in the scene there it is this is my camera so with this camera um oriented this way i'm going to have some view transformation that will take all these vectors into this camera space or view space all right now as you can see this this z coordinate here is pointing towards behind the camera so camera will be looking at looking towards its negative z direction it's local negative z direction i'm calling it local negative z direction because negative z direction in this space is different than negative z direction in this space i'm talking about camera space negative z direction y represents the up vector as we call it uh and x is you know representing the the side direction so um i'm gonna have to like to be able to define this transformation i am going to need to uh figure out where my camera is positioned so like the position of the camera that will define its translation and i'll need to figure out how it's oriented how it's rotated uh so typically um we can we can do this by just moving the camera and rotating um a scale probably i shouldn't apply because you know why would i scale my camera uh but you know translation and rotation can be directly used translation rotation matrices for placing a camera but what we typically use for defining this transformation is that um is is just a little bit different the way that we would typically use uh define this this transform transformation is that we're going to define the position and then we're going to define in which direction the camera is looking at that's going to be my negative z direction and which what is my up vector and if i know which direction the camera is looking at and what is my up vector i can actually get the cameras x x y and z coordinates in world space and if i know those vectors in world space i can easily construct the transformation matrix uh that will uh that will basically give me that transformation to that space so that's typically how we construct it uh but for the time being that part is is not too important so i'm not going to get into the details of this but you can also construct it by applying transformation rotation and scale and so forth all right so this is what we did we built our scene and then we transformed everything to a to camera space now um or the view space now in the view space if my scene now looks something like this right this was this was where my camera was right so it's like i'm i'm looking through here so this is what my scene looks like in this camera or view space so my view volume contains you know a part of these these objects maybe maybe all of them maybe it may be a part of them so i'm just going to be uh projecting these i'm just going to be projecting these to the screen to see them right so uh the question is um how do i how am i going to define this this view volume i mean i i know how to define the the camera coordinates we we talked about this right so i know how to transform vectors into this space but this v volume has to be defined as well so the way that i'm going to define this video volume is of course like the the one end of my monitor is going to be uh or bottom up end of my screen is going to be the minimum x coordinates let's call it the the left side l right so this is there it is that's the left side and the right side is going to be r so x values going from l to r are going to be within my v volume i can do the same thing for y y values going from this b representing bottom to t representing top are going to be within the new volley uh i can do the same thing in in z so uh what i'm going to have here is that at the very end i'm going to have a far plane so i'm not going to be seeing things all the way to infinity i'm going to be seeing things up to a certain distance uh and that's going to be defined by the far plane so let's call it f i can actually do the same thing for uh for the the closest z uh z values so i can also define a near plane and i'm actually i'm going to have to define an airplane it doesn't have to be zero i can just put it wherever i want actually in most cases it's not going to be zero but it doesn't matter for a time being so i'm just picking a value for that so i have near value and a far value for the z-axis as well now this is my view volume um but what we typically use um when we're doing uh rendering related uh operations projection operations is that i would like to take this view volume to uh and convert it to something uh that's more standardized so i would like to convert this to something that looks more like a unit cube it's not quite a unit cube uh it's actually larger magnitude it's it's what we call this this canonical view volume and the canonical view volume uh i'm going to have the the limits of my view will be defined such that all in all three axes um the the valid values inside this volume will be uh from minus one to one minus one to one and x minus one to one and y and minus one to one in z right and so the center of my v volume by definition uh canonical v is going to be the center of this cube all right so it's g it's a two by two by two cube um that's the the canonical v volume that we use uh for for representing everything so at the end at the end what i would like to do is that i would like to get i would like to take my camera space positions and convert them into a canonical d volume and that's what we're going to be calling uh projection transformation right so projection is the process of taking this camera space and convert it into the this canonical view volume um now the the the interesting thing here is that so if if this is the z-axis the image is going to be formed on on this side of the on this side of the canonical view volume right okay the image is going to be sort of squashed into a a square so i can you know non-uniformly scale it to the to the correct shape so i can see it properly uh but in the canonical view volume i'm going to have this this square side that's going to be showing the image that i'm i'm seeing but i'm also keeping i'm also keeping the z values here i'm also keeping this this uh volume nature 3d nature of the data so that i can use it for for other operations so i'm not going to actually collapse it into a 2d image i'm just going to look at this side of the v volume right and you know it doesn't really make any any difference in terms of computation so i'm just going to look at the x and y coordinates and i'm going to use the z coordinate whenever i need it if i need it in the canonical v-balling okay now there are different ways of doing this uh projection transformation uh the simplest one is going to be orthographic projection uh in the orthographic projection i have this camera view space that is shaped like a box and i'm going to take that box and i'm going to scale it and and translate it and convert it into canonical view volume right so in this um camera space let me go through this again our limits were defined as here i i in x i have left and right uh values defined and and and y i have uh bottom and top and in z i have near and far wow all right i think i messed up this label this label is supposed to be over here yeah left and right yeah all right um all right so in the canonical view volume i'm going to have convert b's to uh minus one and one so um i just need some transformation matrix that will do this for me right so let's say that it's going to be something like this i have my x y and z values and i'm going to get the transformed x y and z values in the canonical gear volume so this is my camera space x y and z values for any vector for any vector and this is going to be my my canonical v volume space x y and z values um so you know we have quite a bit of question marks here let's let's try to fill them up uh so the last coordinates we know that we're using it for for cheating we don't really need it so i'm not going to modify the the fourth coordinate so the last row is going to be just zero zero zero one right so it's not doing anything i don't really need it i'm just keeping it around so i can apply and easily apply translations uh so going from camera space to the canonical view space what you might you must have noticed is that the directions of x y x y and z directions are aligned right they're not different directions uh so there is no rotation from camera space to the canonical view space uh because there's no rotation my matrix here this the the three by three component here is not going to contain any any rotational component so this three by three component is just going to represent some amount of non-uniform scale and if this is a non-uniform scale matrix it has to be a diagonal matrix right so a diagonal matrix will have zeros everywhere except for the diagonal values uh so i'm going to have some scale applied and some translation applies so i'm going to move the center from the center of my camera to the the origin of the canonical view volume so there's going to be some translation um uh and and there's going to be all the translations probably going to be along the along the z direction but it doesn't have to be so that you can define it in a more general way um so there's gonna be some translation and there's gonna be some scale because i don't i would like my left and right values to be scaled to uh minus one and one so uh all right this is this is enough uh so talking about this so here's what this this uh matrix will look like uh this is not the cleanest form of writing this matrix but i i find this a little more intuitive to look at so as you can see so let's let's see what this matrix does let's take a look at one row at a time so let's take a look at the x row so the x value is going to be multiplied by 2 times this r minus l what is i minus l my right value and less value so that means the width of my camera space view volume so i'm going to divide it by this so that kind of makes sense because i'm trying to normalize it right uh and i'm multiplying it by 2 because my canonical view volume will have edge size of two units right it's not going to be just one unit so i'm dividing by the width of my v volume and multiplying it by the the desired v wall inside a view of this desired canonical view of uh volume size in x direction right so you'll you'll see that the scale factors are exactly um similar in in all directions for y it's going to be from bottom to top four z is going to be near to far right uh and they're all multiplied by two because that's that's what we want and of course we're going to have to shift the the coordinate frame center to where it's supposed to go uh so uh if you look at here uh what you see is that the x value so this this all right let's take a look at the first row uh this is multiplied by the given x value so it applies some scale y and z coordinates are ignored and this is just the translation that i apply along the z direction sorry along the x direction the translation that i apply along the x direction so this is just to bring everything bring the center to the center of the canonical volume right uh and if you um uh so you you should be able to see if you if your x value is uh left then you're gonna get two times left uh divided by r minus l over here it's going to be minus two times left divided by our minus l so these two terms are gonna cancel out each other and i'm gonna get minus one right uh so if i if my x value is right then i'm gonna have a two times right here minus two times left so when you add these two together i'm gonna get two two minus one is gonna give me one so it's going to be linearly scaling between minus one to one right that's why i like writing them in this form because kind of makes it easier to see uh but when you look at it people typically like writing it this way it's just more compact form uh it's it's the same equation but looks a little bit more ominous to me uh takes a little bit to to decode takes a little bit more to decode this one so basically i'm doing some very simple scale and translation and this is how i'm getting my orthographic projection all good all right so pierce an example of an image generated using orthographic projection um what does it look like do you like it but looks okay right i mean maybe you like the materials and stuff but things look a little odd a little strange if you pay attention um yeah it's a it does look like isometric projection that there is absolutely no perspective here and so like all of these parallel lines are still parallel and it looks a bit weird i mean it kind of looks like an um a design document than an image that you would actually expect to see when you look at something uh and because our eyes don't quite work like this we never see anything like this we don't see anything with orthographic projection so this looks rather strange but it is also very very useful uh so it's um the the useful thing here is that you know objects are not going to lose their scale so if i take an object and put it far far away from the camera it's going to have the same size when you look at it from perspective view things further away we expect them to look smaller right because that's what happens in perspective so yeah now okay if it looks normal to you don't worry about it let me show you what perspective would look like so if you apply a perspective this is at the same what the same scene would look like i mean obviously this is not exactly the same camera transformation because perspective projection and orthographic projection are they they're different enough that it's kind of difficult to use the same camera transformation to get something that looks decent for both uh so if you if you look at this one uh you'll see that this is more along lines like what you would expect to see when you when you look at something and if you compare these two you'll you see that there's there's there's quite a bit of perspective distortion here that kind of makes things look uh a lot more natural all right so uh orthographic projection is very very useful for all sorts of design related stuff but but if you want to render something in the way that people would expect to see you probably want to use something more like a perspective projection all right so here's the the tricky part now things are going to get a little bit more complicated here so uh i know you've been listening to me for quite a while now but try to uh pay a bit more close attention things are gonna get more and more tricky as as i'm coming closer to my last slide so uh brace yourselves okay perspective projection so the reason why we're seeing things distorted in the perspective way is that because um our eyes are you know kind of small and our cameras are like this as well we don't have you know screen size eyes it's just looking at the world in peril we kind of used to see things from a points perspective so you can think of this as like i have my my display here and my camera is behind it i'm just looking through that display from from this camera right so it's it's like when i look at the scene the view volume that i'm going to be seeing is going to be expanding like this so it has this this um this pyramid-like shape because of this perspective distortion now this is linear perspective so this is what things are going to look like with this kind of perspective distortion all right so i'm going to have to figure out a way to account for this strange rather strange shape and figure out a way to incorporate that into my transformations all right so let's take a look at this uh this is the shape that i'm dealing with now uh and so my coordinate frame will look like this right again z coordinate is moving my camera is uh looking in in the minus z direction uh there's x and and y coordinates horizontal and vertical directions in the camera space so that's all the same and uh what i would like to get out of this is is something like this what i would like to do is i would like to take this sort of strangely deformed shape and convert it into changes shape into something that looks more like this because if i do this if i do this then i know how to do the i know how to do viewing now if i can take this space and apply some perspective transformation that gets me into just deforms that shape into this then i can do my orthographic projection and see things from as i did before so uh and this way i'm going to get the perspective distortion as i wanted and i'm going to be using the same machinery that i talked about for orthographic projection so this is a tricky bit this is not the entirety again i just want to stress this point this is just to apply this perspective transformation is not perspective projection this is perspective transformation before orthographic projection so if you combine perspective transformation and then orthographic projection we're going to get perspective projection and that's what we want to do right so this is what we want to do deform this shape into something that looks more like this guy uh all right so how am i going to do that well let's try to understand what's going on here this is actually not something very complicated um this is still sort of like a linear thing uh there i have lines here in this space uh that's all of these lines are originating from the from the origin and going through this space like this all of these lines will be when i when i deform them when i apply perspective transformation they're going to turn into these parallel lines so that's what i'm trying to achieve with this perspective transformation and if i do this if i figure out a way to do this perspective transformation then i can use my orthographic projection to generate my image all right well let's figure out how to do this so i'm not going to just give you the formulation and say use this i'm actually going to try to explain how you get it um i don't like memorizing things i don't like asking people to memorize things it's much better to try to understand how where things come from i think so let's try to do that so let's uh simplify this view a little bit just take a look at one slice of it i'm so like the x direction is here i'm sort of looking at the y z plane right and i picked just one of those one of those line that i showed you in the previous slide uh originating from the origin uh just passing through this volume uh starting from the the near z value to the far z value right so i have this line segment here and what's going to happen to this line segment is that when i apply my perspective transformation it's going to turn into a line that is along the z direction right uh so i i mean i could pick any arbitrary position for this but i said let's align all of these lines with where they intersect with the the near uh near plane okay so i'm going to put all of these lines starting from the near plane just as a frame of reference and that's perfectly fine to do regardless of if if we did something else we get this same thing so it doesn't really matter so uh it's it's there intersect these two line segments or these two lines if you think of them as something they intersect at this point exactly and one of them is along the z direction and the other one is going through the origin right so i would like to take this guy and somehow convert it into this guy um and the nice thing about this one is is that uh it's it's the value of this y-axis remains constant right for the entire volume uh i'm going to be getting the same y value here so um if i think about any arbitrary point here uh along along this line um let's see that the important property of this and this is how we you will be able to do this any arbitrary point p along this this this line uh of course it has a a y coordinate and and the z coordinate right so for all points along the line this value y divided by p y divided by p z is going to be the same for all of the points for any point along this line this is going to be the same and that kind of makes sense because py divided by pz is going to give me the tangent of this angle right so since all of these lines are along the same angular direction that has to be the same right does that make sense so i know that this is going to be the same so maybe i can use this for uh transforming this line into the other one let's see if we can do that so um yeah i'm taking this some some arbitrary point with px and py and i'm showing you the same slide again and now i'm going to move to the next slide so i but but what i would like to do is i would take this this line and convert it into into this one and when i convert it in this one let's say my resulting uh y value is going to be p prime y right just following the same notation that we did uh so how am i going to do that well you know this this quantity is the same right so uh this quantity is going to give me my tangent if i multiply this quantity with the z value i should get the y value right i mean if i multiply this with pz i get py that kind of makes sense but nice thing here is that now that i can tell this value if i multiply it by n if i multiply by n i'm going to get this value basically i'm going to get this p prime y so this p prime y is going to be defined as this this this term a py divided by pz or multiplied by n now i've been showing you this in the y z plane uh but if you look at the third dimension it's exactly the same that follows the same symmetry you can write the same equation for the x axis as well so p prime x is going to be um px divided by pz multiplied by uh the new distance so i can write this in some as a vector equation like this all right so this is my 2d x and y coordinates that's going to be coming out of this perspective transformation uh and the x y coordinates are multiplied by this constant it's not a constant i'm not liking this now if i was multiplying this by a constant i can do that easily but i'm multiplying so i'm taking a vector and i'm sort of dividing its x and y coordinates by its z coordinate this is tricky this is tricky because i wanted to represent all this stuff as a matrix multiplication step how am i going to take a take a vector and divide it by its z component using a matrix multiplication i can't do that that's actually not possible to do so i'm going to cheat again to do this the way that i'm going to cheat you know i cheated for translation so i can cheat for this as well actually the way that i'm going to do is i'm going to extend the concept of homogeneous coordinates just a little bit so remember we added this one here and we said oh it doesn't matter we're just going to be using it don't pay attention to it now i'm extending this definition i'm saying um all points uh with the z the this this fourth coordinates that's called alpha um all of all points that can be written in this form are equivalents to each other so this point means exactly the same point they've written like this uh so alpha value can be anything if i just scale all of the x y and z components by the same alpha value i'm going to be representing the same very same 3d position in the same space okay so this is just a generalization of this this concept of homogeneous coordinates actually this is the full definition of homogeneous coordinates now um so this we're going to be making use of this fourth coordinate so i'm extending this this definition like this uh so uh now the one way to think about this is this way what i'm interested in in all of these transformations is 3d i'm trying to manipulate 3d points what i'm using is a 4d vector so i'm i'm in a four-dimensional space but what i'm trying to represent is a three-dimensional point or three-dimensional position or three-dimensional vector so what i'm saying here is that in this dimensional space any position along this line in the four dimensional space by with with different alpha values uh in this four dimensional space all of these will correspond to the same position in the three-dimensional space that's what i'm trying to say uh with this definition of homogeneous coordinates okay so um in graphics we're going to be making use of this for all sorts of transformations uh and it doesn't matter if i write a position like this or like or like this they they're supposed to mean exactly the same thing there's really no difference between the two right i'm putting equivalent sign here but i could put equal as well and that would be fine i'm just trying to be a little more careful okay so here's here's the thing what i would like to do is this i would like to get my final positions x and y they're going to be uh the near near distance uh multiplied by x and y coordinates divided by p z and i'm not exactly sure what i'm going to do with the z coordinates so for the time being let's call it question mark in this case this is one but to be able to do this division the way that i'm going to do this is that i'm going to be representing that vector in this form and this is a lot easier to do so i'm going to say the x coordinate and y coordinate are just multiplied by some constant n and this near value constant and this pz i'm just going to put it in the fourth coordinate that means it's going to be dividing these two coordinates right this is going to be this this vector this position is equivalent to this one all right so that's the general definition of homogeneous coordinates you know i warned you before i told you that we're going to fill with the this fourth quarter later on this is what i was talking about all right so now let's try to do a perspective transformation using this concept so what i'm going to try to do is to represent this point i'm actually going to produce this output right so i'm going to figure out a way to do a transformation that's going to generate this and i can you know fairly easily do this right so x and y are just scaled by n and this fourth coordinate is just coming from the z value so i can write it write a matrix multiplication in this form this is a very very simple form right so scale values n and uniform scale and this this fourth coordinate is just the z value right just uh you know zero zero one zero i'm just copying the z value from here to the fourth coordinate very very simple and that's the entirety of perspective projection except for this guy here except for i haven't told you what to do with the z component now that's that one is a little bit tricky um that that part is a little bit tricky let's let's let's talk about this a little bit uh so over here um i don't want to destroy my z coordinates because that i can use them for for all sorts of stuff um i i don't want to necessarily scale them to some values between 0 and 1 because i'm going to do orthographic projection after this perspective transformation so that orthographic projection will handle everything so what i would like to do if i can is i would like to keep these z values as they are i don't want to modify them right so but if i just write here 0 0 1 0 i'm going to get pz but it's going to be effectively multiplied by pz so effectively it's going to mean one uh so that's that's that's not gonna work out so what i would like to get here is pz that's what i would like um but if i just write 0 0 1 0 this is going to be p z but this is going to be pz as well so they're going to be when you divide them together effectively the third coordinate the z coordinate is going to be effectively one so that's not gonna help me so much uh so what do i do um here's what i do i'm going to modify i'm gonna have to do something else what i would like to what i actually want is something like i would like to get pz squared here and and this this guy's gonna be pc so if this pz squared and if this is pz you know you just you know divide by pz and you get what you what you want so your z coordinate is not modified at all but i can't do that and trying to get that is going to require even more trickery than i would like to do so what i'm going to do is that i'm going to modify the z value but i'm going to try to minimize that modification as much as i can all right so what i would like to do now in this case i'm just going to give you the the results uh so here is what i'm going to be using uh near and far values near and far values um so near plus four and minus near uh four times near so um the reason why i'm doing this is is this now pay attention to this guy if my z value is at the nearest position if it's if my z value is n what i'm going to get out of this is this this matrix multiplication basically represents this formula right the output z value is going to be this now simplify this just uh just a little bit apply this division by pz over here i get this i know that pz is n right because you know that's what i said if pc is n this n are going to cancel out each other so i'm going to get this guy and then from here i get n huh okay this is good so if i start with n i am getting n which is good because i really didn't want to multiply my z values um what happens if i put if i look at the far plane if my pc value is at the far plane then this this equation is going to simplify down to this and i'm going to get the far value so what this is doing is that it's scaling it's sort of deforming the z coordinate but keeping the extent of the z coordinates as it was before so i'm not trying to suggest here that the z coordinate is unmodified i'm i'm not trying to suggest that i'm actually getting this pc here i'm not all right i'm not getting this pz i'm modifying it but i am modifying it in a way such that the extent of pz values are it's still going to be the same extent all right but they're going to be sort of uh non-uniformly scaled a little bit uh and that's really all about it so this is going to be my perspective transformation uh matrix and the really tricky bit is is this trick and this trick is not actually too crucial in my view because at the end of this we're going to take this perspective transformation and we're going to apply an orthographic projection after that um so it's maybe it's okay to have a slightly different value so this here's what i'm what i'm trying to say let me actually show you the full thing um i'm going to start with perspective transformation uh uh and i'm going to apply this perspective transformation matrix and i'm going to get this this view space and then i can apply my orthographic projection and that will the whole thing is going to be my perspective projection but i think this notation is a little um misleading just a little bit because of the way that things are ordered so let me swap things around and show it from this direction now we're first applying this right first perspective transformation so that matrix has to be on the right side first perspective transformation and then i'm applying orthographic projection um and when you multiply these two matrices together this is how you're going to get your final perspective projection matrix all right so once again if you if we compare orthographic projection and perspective projection the only difference here is that i have a perspective transformation step in the middle well before i apply uh orthographic projection and by now i apply this perspective of projection i'm getting the uh sort of nice perspective distortion that i want um okay so um with that i believe i've covered everything that i wanted to regarding uh transformations uh i i hope that you know you you understood uh sort of why all this stuff is very very important and very fundamental to all sorts of graphics operations now we're not going to be using these 3d transformations or viewing transformations in the next project because i would like you to experiment with transformations in 2d first but in the upcoming projects when we switch to doing things in 3d we are going to be using these transformations so it's sort of important that you uh understand all these concepts uh pretty well thank you for joining and i especially thank those of you who are showing me your your your videos it's really great to see you all and i'll see you next time thank you thank you

Channel: Cem Yuksel

Views: 2,984

Keywords:

Id: 1z1S2kQKXDs

Length: 63min 37sec (3817 seconds)

Published: Mon Feb 08 2021