Thin instance rotation with internal data structure

Hi,

looking at the thin instances example from the docs here: https://playground.babylonjs.com/#V1JE4Z#1

How would i go about rotating boxes (but not all of them) around, let’s say the Z axis, given a angle in degrees or rad?

I know that certain array indices of m.m[], correspond to the position of a box:

m.m[12] is x
m.m[13] is y
m.m[14] is z

But I struggle to understand how to set a rotation using the internal data structure m.m[].

Any help would be appreciated!

Hey there, setting rotation and scaling is more complex but the Matrix class has methods to help handle it for us. :slight_smile:

For example the Matrix.ComposeToRef() method is used to build the matrix from scaling, rotation, and translation parameters. Below each thin instance is just given a different random rotation about the z axis for example.

I semi-recently learned how to do this stuff myself with help from the community here. I’ll try to accurately give back some of that knowledge.

Scenario 1) You are about to create your thin instances for the first time: See Blake’s answer.

Scenario 2) You already have your thin instances instantiated:

Say you have a mesh, say rootMesh, in order to rotate a particular thin instance of rootMesh here’s a method you can use:

/*
@param rootMesh: BABYLON.Mesh
@param thinInstanceInds: Array<number> An array of index values to the particular thinInstances
@param rotation: [
      yaw: number   - @param yaw — defines the rotation around Y axis in radians
      pitch: number - @param pitch — defines the rotation around X axis in radians
      roll: number  - @param roll - defines the rotation around Z axis in radians
   ]
*/ 
const rotateThinInstances = (rootMesh, thinInstanceInds, [yaw, pitch, roll]) => {
  const worldMatrices = rootMesh.thinInstanceGetWorldMatrices()
  thinInstanceInds.forEach((ind) => {
     const matrix = worldMatrices[ind]
     const rot = new BABYLON.Matrix()
     BABYLON.Quaternion.RotationYawPitchRoll(yaw, pitch, roll).toRotationMatrix(rot)
     rootMesh.thinInstanceSetMatrixAt(ind, matrix.multiply(rot))
  })
}

You might be wondering why you can’t just set values directly in the matrix such as with the position as you mentioned (I started off trying to do this as well), try inspecting the results you’d get from this:

const rot = new BABYLON.Matrix()
BABYLON.Quaternion.RotationYawPitchRoll(Math.PI / 4, 0, 0).toRotationMatrix(rot)
console.log(rot)
BABYLON.Quaternion.RotationYawPitchRoll(Math.PI / 4, Math.PI / 4, 0).toRotationMatrix(rot)
console.log(rot)
BABYLON.Quaternion.RotationYawPitchRoll(Math.PI / 4, Math.PI /4 , Math.PI / 4).toRotationMatrix(rot)
console.log(rot)

And now imagine multiplying that against another matrix. The results are not so straightforward to imagine for arbitrary rotations.

1 Like