# Vector Math: For Fun and Profit

Part 1: Hamsters, Scales, and Addition

Lets talk about vectors for a bit. I was taught briefly about them (along with sin and cos) waaaaay back when, in trig and geometry back in high school. They were just this thing I had to learn and they didn’t tie into reality. After those classes they just gathered dust in the corner. I’d occasionally see it out of the corner of my eye in the form for ‘vector art’ or ‘vertices’  for 3D models, but still, not really relevant. This all changed when I started programming games. Maybe I changed, or maybe they did (it was me, vectors haven’t changed much.) But now we get along great. Vectors are amazing, powerful tools and the best part is that they are dead simple.

I’m going to keep this light and full of pictures, so if you want to dive in deeper, Kahn Academy has you covered.

First, what is a vector? It’s a few numbers that are related, usually describing something to do with space (position, speed, force, etc).  A vector 2 looks like this [2,3] – because there are 2 numbers. Vector 3 [3,2,5]. There is one number for each plane you are talking about. In fact I’m pretty sure you could have a vector 1 if you felt like it and these observations would still apply.

Lets look at a vector in 3D space, talk about a few properties, then we’ll get into actual use, games!

This is vector 3 would be written down as [3,5,2].

Right off the bat we can see that it’s describing a point in space. It’s over a few units to the right (x : 3), it’s up in the air some (y : 5) and it comes at us a bit (z : 2).

Another thing it describes, is a direction. All spaces (a place where vectors live) have something called an origin. When I say that vector is 3 units over to the right, what is it over to the right from? Well, the origin. An origin is (0,0,0) in whatever space you are talking about. What is really cool about physics, or spaces in general is you can always pick your own origin, and align the axis in whatever way makes your life easiest. Though more discussion on that is out of the scope of this post.

Lets pretend that point represents a ball in the air, if you were to stand on the origin and look at the ball, you are looking in it’s direction. So if you know a point in space, you know a direction (always relative to the origin.)

The last thing it describes is a distance, or simply, the length of the line segment that connects the origin to our point. In this case it is a length (sometimes referred to as magnitude) of 6.1644. We got this by using the good ‘ol Pythagorean Theorem. A^2 + B^2 = C^2, or in our case X^2 + Y^2 + Z^2 = L^2 (L, being length.) It doesn’t matter that we have 3 planes instead of 2, the math transfers. In fact it works in 1 dimension as well. 3^2 = 3^2 after all.

I’m getting antsy, lets jump into talking about games. We can pick up operations as we go.

First thing, lets have a character, how about a hamster? That’s what you were thinking as well? Excellent.

Alright, we have our hamster, lets name her Stella. Since this is a game we have to have some mechanics. The first one that comes to mind, is movement. Lets say if the player presses W, Stella will move forward one unit in the X axis. As a vector that looks like [1,0,0]

There are a couple things going on here, I drew just the [1,0,0] vector coming off of the origin. I also drew it coming off of Stella, as that is how vector addition works. You just line them up, and do simple arithmetic.
[1,0,0] +
[2,0,5] =
[3,0,5]

Just like in normal addition, order doesn’t matter. In fact you could break Stella’s new position up into 3 separate vectors and add them together to get her new position
[3,0,0]
[0,0,0]
[0,0,5]

Excellent, Stella can now move forward. If we extend this logic a bit, we can have her move back with D. Instead of adding [1,0,0] we will add [-1,0,0]. We can also subtract [1,0,0] from her position, either way. Just like with arithmetic, it doesn’t matter which way you prefer. We can also giver her side to side by adding and subtracting on the Z axis when the player presses D and A, respectively.

One observation I wanted to point out about the above drawing, you can see that when we break up the vectors, it looks like we are drawing a box. To some extent we are, with 2 points you can define the minimum and maximum points of a box, and if we use the origin as the other point, we totally have 2 points.

You can see I went ahead and decided to draw a triangle that the vector can describe as well. If you think about it a bit more, that box actually describes 3 different triangles. Plus it describes 3 sets of 2 rectangles (each of the faces.) Those faces can all be made up of triangles. I’m getting ahead of myself, but the more relationships you start to see, the more you can have vectors do work for you. Though the opportunities really build up when we start to add sin and cos.

The final thing we will do is make it so that you don’t have to keep tapping the key to move down, lets let you hold the key.

For the sake of argument lets say we are running the game at 30 frames per second. Lets also say that we want Stella to move 5 units per second in the direction we are holding.

After some unit conversion

We come up with 0.16666 as the distance we want Stella to travel, every frame, in whatever direction the player is pressing.

How do we use this number? Well, when are dealing with vectors, numbers that just live by themselves are often referred to as scalars, or scalar value. If you recall, we encountered one of these earlier when were talking about the magnitude of a vector.

Multiplying a vector, by a scalar value (which is what we want to do) is simple. It’s noting more than distribution. In our case, it’s the even simpler because our starting vector looks like [0,0,-1]. So, [0,0,-1] * 0.166 looks like [0 * 0.166, 0 * 0.166, 1*0.166] which becomes [0,0,1.66]

Starting at [0,0,0], if the player holds S for 3 seconds, Stella would then be at [0,0,-15] :   30 (frames per second ) * 3 (number of seconds) * 0.166 (units per second) * [0,0,-1] (our vector)

If the player then taps W for 3 frames, and they’d end up at [0.5,0,-15].

Next time we will look into acceleration, unit vectors / normals. We will do this by putting Stella in spaaaaace.