From the Greek for “Triangle Measure”, Trigonometry is both a branch of mathematics that deals with the relationships between the angles of a triangle and the lengths of its sides, and one of those subjects that you probably suffered through in your math class, possibly while making complaints to your teacher or friends that you’re never going to need to know this stuff.

As it transpires, if you’re a game developer (or want to be one), knowledge of Trigonometry (lets just call that Trig for short from now on) is actually pretty important. So lets go over the basic principles of Trig and how we might use something like this in a game.

Trig is most commonly associated with right triangles (you might remember them from our discussion of the Pythagorean Theorem a couple of posts ago). The concepts can be extended to any triangle with some more math, but since you can convert any triangle into two right triangles by cutting it in half, it’s easiest to just focus on right triangles.

The basic tenet of Trig is that there is a ratio between the angles that make up a right triangle and the length of the sides of that triangle, and this ratio is fixed. As long as this ratio is maintained, the angle remains the same. It then follows that by knowing the length of the sides, you can construct the ratio, or by knowing the ratio, you can obtain the lengths of the sides.

Here we can easily see that for these three triangles, all three have angles that are identical, and in each case the ratio of the length of the sides is the same. For example if we compare the height of the triangle to it’s width:

Using your friend Pythagoras you can determine that the hypotenuse is similarly changing; I’ll leave that as an exercise for you to follow up with on your own, though.

Since there are three sides to the triangle, there are three such ratios. Which one you use depends on what angle you’re trying to calculate or which sides of the triangle you know. Don’t forget that Pythagoras says that you can determine the length of the third side as long as you know two of them, and that the sum of all of the angles in a triangle is 180 degrees, so if you know one of the two non-90 degree angles, you can easily calculate the other.

There are three main trigonometric functions that we’re going to concern ourselves with here for the moment: Sine, Cosine and Tangent. For the purposes of Trig, the three sides of the triangle are labeled the Hypotenuse, the Opposite and the Adjacent, and which ones you use depend on which trig function you’re going to use.

Fun mnemonic time! Some Old Hippy Caught Another Hippy Tripping On Acid, or SOH-CAH-TOA. If you can remember this, you’ll laugh harder than I do every time I need to remember a trig function, because I learned this as Oscar Has A Heap Of Apples, which is entirely less funny than an acid tripping hippy, although I guess Oscar has no medical woes. Either way, this helps you remember the relationships between the sides of the triangle and the angle involved.

The Hypotenuse is always the side of the triangle opposite the 90 degree angle, but the Opposite and Adjacent sides depend on which angle you are trying to figure out. Based on the SOH-CAH-TOA mnemonic above, the three trig functions are:

Just to prove that all of these three things work, lets take an example using the same triangle that we used in the Pythagoras post, and try to determine what the top angle is. Note however that as I mentioned above, the results of this is a ratio. You still need a way to convert the ratio to an actual angle, but we’ll talk about that in a moment. For now, just assume that my pants are not actually on fire (OR hanging from a telephone wire).

The ratios are just that; ratios. This is the core concept that allows a triangle with sides of proportionate lengths to have the same angles. 4/5 is 0.8, and so is 8/10; bigger sides, same ratio, same angle.The output of the trig calculations gives you a constant value that represents the angle, but there’s still more work to do to actually turn it into the actual angle you care about.

In the old days before computers and calculators, in order to determine what angle associated with sin 0.8, cos 0.6 or tan 1.3 you would pull out a handy table which allowed you to cross reference the number you had with the appropriate function and thus determine what the angle was.

These days we use our calculators (or, as game developers, programming languages/game development tools) to do this for us. In programming languages, the functions generally have names such as asin, acos and atan. If you’re using a pocket calculator, they might have names like sin^-1, cos^-1 and tan^-1.

Something else to point out here is that there are actually a few different ways to talk about angles. If you’re a normal human being, you use the term “degrees”, and you might say “I turned right 90 degrees at the corner and kept walking” (well, if you go around saying things like that, your normalcy may be called into question, but I digress).

If you were a humongous mathematics nerd, instead of referring to the angle in degrees, you would use something called radians instead, so you would probably say something like “When I encountered the corner, I rotated my facing clockwise 1.57 radians and proceeded towards my destination”, probably while pushing your horn rimmed glasses up your nose or straightening the pens in your pocket protector.

Most programming languages are going to want to work in radians and not degrees, so you need to do some conversion work. If you’re working with a scientific calculator, you can tell it to use degrees or radians (there is also a third option, gradians, but lets not go into that).

The whole deal with radians versus degrees is a math topic unto itself, and this page on Wikipedia explains it and even has a little animated image that shows you what a radian looks like visually. We don’t care about that, though. Takes away from our game development time.

So, lets just distill the information on that page down to this nugget of information:

There are π radians in 180º (and thus 2π radians in 360º)

This leads to the following two simple math formulas for converting to and from degrees:

Lets test it out with the calculation from up above:

Looks like that worked out. For the time being at least, I know what I’m talking about (or at least look like I do).

Note that there are some pitfalls here. The most notable are these:

• Angles in a triangle add up to 180 degrees always, so trying to find the sin or cosine of an angle larger than that is likely to do not entirely what you expect to do. If you sit down with some paper and ponder things, you can see what it’s actually doing for you, but the easier thing to do is detect the situation and add or subtract 180 degrees as needed.
• You might notice that the Tangent function gets all stupid at 90 and 270 degrees. This is because at that point the cosine is 0, which means that one of the sides of the triangle is 0, which puts a 0 in a bad place for a division by 0. This is technically known as an asymptote, but I’m going to leave it up to you to look up what that actually means if you’re interested. For now it’s enough to know that it’s something to watch out for.

It’s been a long journey, but now to answer one final important question: What you can you actually do with this? As always, the world is your oyster; the more you know, the more tools in your toolbox for.. tooling.. or something.

Some possible examples of usage in games:

Top Down Shooter

You’re making a top down shooter, and you want the main character to always be facing where the mouse pointer is pointing. To do that, you’re going to need to know what angle to rotate the player sprite so that it’s pointing in the correct location; since you know the location of the player and the location of the mouse cursor, you can use Pythagoras to calculate the right triangle between the player and the mouse, and then use Trig to calculate the angle between the two.

Side Scrolling Shooter

In order to better understand how these trig functions work, you write a little sample program that calculates the sin and cosine for all of the angles in a circle, just to see what happens (tip: you should totally do that). When you do, you discover that the sin of an angle slowly goes from 0 to 1 and back to 0. Sort of like a sine wave (so THAT‘s why they call it that). Similarly, the cosine of an angle does the same thing, but it starts at 1 instead of 0.

This puts you in mind of the aliens in a side shooting game flying in a wave pattern, and suddenly you have a great idea for how to replicate that in YOUR game.

Side Scrolling Shooter #2

While working on the above side shooting space game (you’d think that I love this sort of game or something), you want a power up item that revolves around the player in a circle and you decide that you want to do that by actually rotating the power up sprite around the player. But how?!

Then you remember that with the magic of algebra, you can rework the Trig equations to look like this:

You realize that the opposite side of the angle is the Y component of the point and the adjacent side is the X component of the point, and that the hypotenuse is just the distance away from the center point you want to rotate around, and suddenly BOOM you’ve prototyped some code that rotates a sprite around the player at a distance that you control.

And that’s about it for this week! From here we can move on to some other useful math concepts that rely as much on Trig and Pythagoras as we relied on Pythagoras to tell us things we might not otherwise know in this article.

Until next time!