# Transforming a 2D Grid in 3D Space

Hi everyone,

I'm trying to implement a 2D Grid in a simple 3D Editor. Here are some debug-rays I already implemented:

Everything is working as intended as long as the object is not rotated. For demonstration purpose the box is aligned with the grid center (the purple box).

(I can move the object along the grid without changing the grid location):

Now if I rotate the large white cube I want the grid to rotate as well.

Here is the problem: I dont want the origin of the grid to change it's relativ location. The grid location of the green line should still align with the upper left corner of the large white box.

And I just cannot figure out the offset I have to translate the grid :(

Here is what I've tried: Calculate the difference between the two collision points (Yellow and Green) and use this as offset but on rotation the offset is too large and the grid is shifting.

Here is the data I have available:

Vector3 Origin = new Vector3();
Vector3 GridPlaneNormal = new Vector3(0, 0, 1);
Plane GridPlane = new Plane(Origin, GridPlaneNormal);
Plane objectPlane = /*.... (it's the plane of the cubes front)*/

Vector3 GridNormalInDirectionOfObject = Vector3.TransformNormal(GridPlaneNormal, Matrix.RotationQuaternion(Object.RotationQuaternion));

float angle = GridPlaneNormal.SignedAngle(GridNormalInDirectionOfObject, GridPlane.Normal);
Vector3 rotationAxis = Vector3.Normalize(Vector3.Cross(GridPlane.Normal, objectPlane.Normal));


This is why we use matrices for all of this stuff.

Create a world matrix (aka, model matrix) for your grid, including its rotation, translation and scale.

Create a similar matrix for the cube, relative to the transform of the grid.

When drawing the cube, multiply the cube's model matrix with the grid's model matrix. Use the resulting matrix to draw the cube.

In this way, the cube will be translated, rotated, etc. relative to its own origin, and then transformed to follow anything you do to the grid.

Depending on which graphics API you're using, it'll either be gridMatrix * cubeMatrix (HLSL) or cubeMatrix * gridMatrix (GLSL). (Google row-major vs column-major graphics api for more information.)

For instance, you might do something like this:

class GameObject
{
public GameObject Parent = null;
public Vector3 Rotation;
public Vector3 Translation;
public Vector3 Scale;

public Matrix GetTransform()
{
// you should really cache this as it can take a bit of time to build.
var xform = Matrix.CreateScale(Scale) * Matrix.CreateFromRollPitchYaw(Rotation.Z, Rotation.X, Rotation.Y) * Matrix.CreateTranslation(Translation);

if (null != Parent)
xform = Parent.GetTransform() * xform;

return xform;
}

}

var grid = new Grid();
var cube = new Cube();
cube.Parent = grid;

// etc...


Then, when drawing your object, pass the result of GetTransform() to your shader. (That'll also, of course, get multiplied by your view and projection matrices in the shader.)

Of course, you can do all of this without matrices, but you have to manually rotate your vertex, then translate and scale by the cube's transform, then by the grid's transform - again, rotating first, then translating and scaling - all the way through your hierarchy. It gets messy. The matrix method lets you combine all operations into a single matrix. It's the simplest and most efficient solution.

If you can tell which API, engine, library (SDL? Monogame? XNA? Unity? OpenTK?) you're using, we can provide a more detailed response.

• hi, thanks for the reply. Ofc I'm using matrices for the projection :) (I'm using sharpDX with directx 11). The world matrix for the cude is Scale x Rotation x Location. The rotation is stored in a quaternion. On selection I'm creating the grid (it's a very simple buffer with each lines coordinates and an according indexbuffer). But i cannot get the correct transformation matrix for the grid. I cannot use the same rotation and translation for the grid cause that results in a shifting grid. I'll update the code tommorow. – Lianos Jul 30 '18 at 16:20