Angles and Rotation in Games

How do enemies know where to aim?

1

The Problem: Making Things Aim

In games, we often need objects to face toward a target. A turret needs to aim at the player. An enemy needs to look where it's going. Move your mouse to see the problem!

Move your mouse - the turret needs to aim at you!

250
Target X
150
Target Y
Angle Needed

🤔 The Challenge

We know the turret position (250, 200) and the target position. How do we calculate the angle to rotate?

💡 The Solution

We need a function that converts X,Y coordinates into an angle. That function is called atan2!

2

Degrees vs Radians

Before we calculate angles, we need to understand two ways to measure them. Humans like degrees (0° to 360°), but computers prefer radians. Drag the slider to see how they relate!

📐 Degrees

45°

Full circle = 360°

Familiar to humans

📈 Radians

0.79

Full circle = 2π ≈ 6.28

Used by computers

radians = degrees × (π / 180)
Converting degrees to radians
💡 Why Radians?

One radian is the angle where the arc length equals the radius. This makes math with circles much simpler! All trig functions in programming (sin, cos, atan2) use radians.

3

The Magic of atan2()

atan2(y, x) is every game developer's best friend. Give it the difference in Y and X coordinates, and it returns the angle! Click anywhere to see it in action.

Click anywhere to set a target point

angle = atan2(targetY - originY, targetX - originX)
Finding the angle from origin to target
100
ΔX (targetX - originX)
-50
ΔY (targetY - originY)
-26.6°
atan2 Result

👉 Note: Y is Flipped!

In screen coordinates, Y increases downward. So "up" is negative Y. atan2 handles this correctly!

✔ Handles All Cases

Unlike regular atan(), atan2() works in all four quadrants and never divides by zero.

4

Rotation in Action

Now let's put it together! Watch how a turret uses atan2 to track your mouse. You can toggle smooth rotation to see the difference between instant aiming and realistic rotation.

Current Angle
Target Angle
5°/frame
Rotation Speed
💡 Pro Tip

Real games use smooth rotation with a maximum turn speed. This makes turrets feel realistic and gives players a chance to dodge! Some games also add prediction to aim where the player WILL be.

5

Circular Motion with Sin & Cos

The flip side of finding angles is using angles to find positions. cos(angle) gives you the X component, and sin(angle) gives you the Y component. This creates circular motion!

x = centerX + cos(angle) × radius
y = centerY + sin(angle) × radius
Position on a circle from angle

🎯 Used For

Orbiting enemies, rotating platforms, bullet patterns, radar sweeps, and oscillating objects!

🔄 Key Insight

cos(angle) returns -1 to 1 for X, sin(angle) returns -1 to 1 for Y. Multiply by radius to scale!

6

Turret Defense Challenge!

Put your knowledge to the test! Control a turret and shoot down enemies before they reach the center. Click to shoot in the direction you're aiming.

Score: 0
Enemies: 0
Wave: 1
Click "Start Game" to begin! Move mouse to aim, click to shoot.

Rotation Master!

You've learned the secrets of angles and rotation! From turrets to orbits, you now understand how games make things point, spin, and move in circles.

0
Time Exploring

Degrees vs Radians

Computers use radians (2π = full circle)

atan2(y, x)

The magic function that finds angles from coordinates

Smooth Rotation

Limiting turn speed for realistic movement

Sin & Cos

Convert angles back to X,Y positions for circular motion

Ready to Create?

Put your new knowledge into practice!

More Discoveries

Suggest a Correction