Sonic Battle (GBA) Renderer Series - Walls

Posted on November 15, 2018

Table of Contents

Welcome to the seventh article of the Sonic Battle (GBA) Renderer series.

Coordinate system

Quick reminder: here’s our coordinate system).



All walls are axis-aligned. (Except for the 45-degree walls but they will be discussed in a later article.)

It means that walls only face 4 directions which I will call:

  • Y_PLUS
  • X_PLUS


Our walls represent boxes so it’s safe to assume that if a given side is visible, then the opposite is invisible.

This can be used for an optimization: we need to determine which two sides are visible, and then we can skip the processing of the other two.

The classic algorithm for determining if a wall is facing away from a direction is to check if the dot product of its normal against the opposite of the camera’s direction is smaller than 0.

Our wall directions are the +/-X axis and +/-Y axis.

That dot product for the X_PLUS direction is vec(1, 0) dot -cam.directionIn2D. It simplifies to just -cam.directionIn2D.x. The dot product for X_MINUS is cam.directionIn2D.x.

Similarly, for Y_PLUS it’s -cam.directionIn2D.y and for Y_MINUS it’s cam.directionIn2D.y.

Y-axis scale

For the Y-axis scale factor we project the wall normal on the opposite of the camera direction.

Exactly like we did for tilemaps except now the normal is ()

X-axis scale

For the X-axis scale factor we simply use

X-axis shear


Affine matrix


Note - tilemap and wall base scale


The next article will discuss the depth sorting of the walls.

You can subscribe to the mailing list to be notified when a new article appears.