Step 3

Vectors, Points, and Spaces

Learn about the fundamental concepts of vectors, points, and spaces in the context of graphics programming.

Overview

In Step 2, you developed your first application and connected it to the framework’s lifecycle.

This tutorial turns to the mathematical foundations of simulation, rendering, and physics: vectors, points, and coordinate spaces.

This tutorial presents these ideas through both explanation and practical examples.

By working through it, you will learn:

  • what vectors represent in mathematical and physical terms
  • how points differ conceptually and operationally from vectors
  • why coordinate spaces are essential for interpreting data correctly
  • how transformations transfer data from one space to another
  • how these ideas are expressed within the framework’s math module

By the end of this tutorial, you will have a working command of the core terminology and ideas used throughout the lessons that follow.

1. Vectors: Direction and Magnitude

A vector is not a position.

Rather, it represents a difference, a direction, a change, or a velocity.

Mathematically:

\[ \vec{v}=(x,y,z) \]

But conceptually:

In conceptual terms, a vector describes how to move, not where something is located.

  • A vector may represent velocity, force, acceleration, surface normals, or displacement.
  • Vectors may be added, scaled, normalized, and rotated.

Example operations:

fvec3 v(1.0f, 2.0f, 0.0f);   // Create a 3D vector with components (1, 2, 0)
fvec3 u(0.0f, 1.0f, 0.0f);   // Create another 3D vector with components (0, 1, 0)

auto sum = v + u;            // Vector addition
auto scaled = 2.0f * v;      // Scalar multiplication (using the operator* defined for basevector)
auto length = v.length();    // Compute the length (magnitude) of the vector
auto normalized = v.norm();  // Normalize the vector (make it unit length)

For this reason, vectors are fundamental to both simulation and rendering.

2. Points: Positions in Space

A point represents a position.

It specifies a location within a coordinate system.

\[ P=\left(x,y,z\right) \]

Adding one point to another is not mathematically meaningful.

However, the following operations are:

  • Point − Point = Vector
  • Point + Vector = Point

This distinction is essential in both geometry and physics.

Example:

fpoint3 A(1.0f, 1.0f, 0.0f); // Create a point A at coordinates (1, 1, 0)
fpoint3 B(4.0f, 1.0f, 0.0f); // Create another point B at coordinates (4, 1, 0)

fvec3 AB = B - A;   // Create a vector AB from point A to point B (B - A)
fpoint3 C = A + AB; // Create a point C by adding vector AB to point A (returns B)

Points describe where an object is located.

Vectors describe how that object moves or changes.

3. Coordinate Spaces: Why Context Matters

Every position and every vector must be interpreted within a coordinate space.

The most commonly encountered spaces are the following:

Model Space

  • Coordinates defined relative to the object itself
  • Example: a cube centered at the origin, (0, 0, 0)

World Space

  • Coordinates defined relative to the scene as a whole
  • Example: placing the cube at (10, 0, 5) in the world

View Space

  • Coordinates defined relative to the camera
  • Example: the scene as it appears from the camera’s point of view

Clip Space

  • Coordinates after projection has been applied
  • Example: normalized device coordinates (NDC)

Why this matters

The meaning of a point depends entirely on the space in which it is defined.

The same principle applies to vectors, particularly direction vectors.

For example, a normal vector defined in model space must be transformed to world space to interact correctly with lighting calculations.

4. Transformations: Moving Data Between Spaces

Transformations are most commonly represented by matrices:

  • Translation displaces points from one position to another
  • Rotation changes orientation
  • Scaling changes size
  • Projection maps three-dimensional data to a two-dimensional view

Within the framework:

// Create a translation matrix that translates by (5, 6, 7)
fmat4 modelMatrix = translation_matrix(5.0f, 6.0f, 7.0f);
// Define a local position (point) with coordinates (1, 2, 3)
fpoint3 localPos(1.0f, 2.0f, 3.0f);
// Transform the local position to world space by multiplying it with the model matrix
fpoint3 worldPos = modelMatrix * localPos; 

Key rule

  • Points are affected by translation.
  • Vectors are not.

This is precisely why the distinction between points and vectors must be maintained.

5. Dot Product and Cross Product

These operations appear repeatedly in both physics and rendering.

Dot Product

The dot product measures the degree to which two vectors are aligned:

\[ \vec{a}\cdot\vec{b}=\mid\vec{a}\mid\mid\vec{b}\mid\cos\theta \]

Used for:

  • Lighting
  • Determining angles between vectors
  • Projection of one vector onto another

Cross Product

The cross product produces a vector perpendicular to both input vectors:

\[ \vec{a}\times\vec{b} \]

Used for:

  • Surface normals
  • Torque
  • Orientation

Example

// Define a vector u along the x-axis
fvec3 u(1.0f, 0.0f, 0.0f); 
// Define a vector v along the y-axis
fvec3 v(0.0f, 1.0f, 0.0f); 
// Compute the cross product of u and v, which should yield a vector along the z-axis
fvec3 crossProduct = u.cross(v); 
// Compute the dot product of u and v, which should be 0 since they are perpendicular
float dotProduct = u.dot(v); 

6. Why This Matters in Simulation

Physics simulation is built upon the following mathematical objects:

  • Positions (points)
  • Velocities (vectors)
  • Forces (vectors)
  • Accelerations (vectors)
  • Transformations (matrices)

If points and vectors are confused, the simulation will produce invalid results.

If coordinate spaces are misunderstood, the rendering pipeline will fail to behave correctly.

Accordingly, this tutorial establishes the conceptual foundation needed to avoid such errors.

7. Practical Exercise: Visualizing a Vector

As a practical exercise, you can create a simple application that visualizes a moving point in 3D space.

Steps:

  • Create a new point
  • Define a vector representing velocity
  • Loop over time steps to update the point's position based on the velocity vector
  • Experiment with changing the vector’s direction and magnitude
fpoint3 p(1.0f, .0f, .0f); // Create a point p at coordinates (1, 0, 0)
fvec3 velocity(0.5f, 0.0f, 0.0f); // Define a velocity vector along the x-axis
float deltaTime = 1.0f; // Define a time step of 1 second
// Update the point's position by adding the velocity scaled by the time step
for (int second = 0; second < 5; second += deltaTime) {
    p = p + velocity * deltaTime; // Move the point along the x-axis over time
    std::cout << "Time: " << second + deltaTime << "s, Position: (" << p.x() << ", " << p.y() << ", " << p.z() << ")" << std::endl;
}

By running this code, you will see how the point moves along the x-axis over time, demonstrating the relationship between points and vectors in a practical context.

8. Summary

In this tutorial, you examined the following ideas:

  • Vectors represent direction and magnitude
  • Points represent positions
  • Spaces give meaning to coordinates
  • Transformations move data between spaces
  • Dot and cross products are fundamental tools
  • These concepts form the backbone of physics simulation

These ideas will be used repeatedly throughout the tutorials that follow.

Next Step

In he next tutorial, Step 4: Matrices and Transformations, we will examine matrices and transformations in greater depth and develop the mathematical framework that underlies rendering, animation, and physics.