Chris Minda

So in the last tutorial, we setup our camera and cube and rendered the cube to the screen. Rendering a cube is nice but let’s start moving it around. (The source code can be found here.)

Most if not all of the work we will be doing in this tutorial will be in the new function Update. Our update function will update the cube with the transformations we want performed on the cube using the GLM math library.

The Update function has the parameter of deltaTime passed to it, which tells the function how much time has passed since the last frame has been rendered. This is important if we want the appearance smooth animation across varying platforms with differing performances.

(Note: This is not a tutorial on the math behind the transformations being done. When I get around to writing up a Linear Algebra crash course, I will discuss exactly what is being done mathematically with the cube but for right now we need just a simple understanding of what we want to do with our model so we can scale, rotate, and translate the cube.)

Scaling

To make the cube smaller or larger, we need to specify the scale by which we want to increase or decrease the cube by. While not used in the source code for the tutorial if you ever find that you want to scale a model and are using glm, use the glm::scale function. For example, if we wanted to double the size of the cube, we would call the function like this:

We pass the Model matrix (a 4×4 matrix) and a vec3. The vector specifies how much we want the model to be scaled by on each axis. Since we are doing scaling uniformly along each axis, each value of the vector is specified as 2.f.

Rotation

To rotate the cube, we need to specify the amount of degrees we want to rotate the model by and around what axis we are rotating. We use the glm::rotate function and call it like this:

We have a global variable named degreeRotPerSec which is the number of degrees that the cube should rotate per second. I have specified 10.f as the value for degreeRotPerSec but feel free to use whatever value you choose. Once again we set the model matrix to the identity matrix and then find out how many degrees we are going to rotate the cube by this frame. If the amount of rotation increases beyond 360 we bring it back into the range of 0-360 by subtracting 360 from the current rotation value. Finally, we call the rotate function by passing the current model matrix, the number of degrees we want the model to rotate and the vector that the cube will rotate around, which is just a vector going straight up through the center of the cube.

Translation

To move the cube around the scene, we use the glm::translate function.

For this demonstration of the use of the translate function, I have set up the camera like so:

This will give us a bit more screen space to move the cube without having to move the camera. (The time for that will come). Simply enough if we want to translate the cube to the right we could call the translate function like this:

Once again we pass our Model matrix to the function a vec3 that specifies how much in each direction we want to move the cube.

But that’s kind of dull, let’s have the cube move up and down in the scene. To do this, the update function look something like this:

Here the update function starts off just like the rotate demo, setting the Model matrix to the identity matrix again. And then we have something very similar to the rotate function which may not make sense why we are doing it. Simply enough, the amount of degrees we get from degreesPerSec (I set it to 20.0) * deltaTime tells us a point along a circle (which measures 360 degrees in total, once again we constrain it degrees to 360 just like in the rotate demo). We then use the function sinf, which finds the sine of an angle expressed in radians. Since we are looking at the angle in terms of degrees, we convert the angle to radians by multiplying it by PI (3.14159…) and dividing by 180. By doing all of this we oscillate our value for trans along the sine wave, which ranges values from -1 to 1. We can multiply the value for trans by some value to increase or decrease the amount by which the cube moves. The example multiplies trans by 2 thus increasing the range which the cube moves to -2 to 2.

Combining Transformations

When combining transformations we need to be careful the order we do the transformations in (Note: Why this is will be covered more in depth in the Linear Algebra crash course).

Let’s say we want to rotate the cube by 10 degrees and translate it by 2 units horizontally every second. So we write our update function like this:

That doesn’t give us the result we want! In simplest terms, since we are rotating the cube first we are changing the model space thus changing what is right (the x direction) in relation to our cube. So when we translate the cube after the rotation, the cube still moves right, its just moving right in model space.

If we want to have the cube move right in relation to where it starts we just need to make a quick alteration to the update function. All that has to be done is we swap the translate function with the rotate function and voila it does what we first wanted it to do.

So there you have. That was a quick tutorial on how we can use the GLM Math library to perform transformations on a model in 3D space. In the next tutorial, we will load a model from an OBJ file (rather than create our own by specifying the vertices) and begin learning simple lighting algorithms for shading a model.