Yaw and roll rotations for spaceship

I’m creating a game with a small spaceship and trying to rotate it on its yaw (y axis) to turn and slightly rotate it on its roll axis in the direction it is currently turning.


I thought I could do this by rotating on the y world axis and the z local axis

mesh.rotate(Vector3.Up(), increment, Space.WORLD)
     (Math.PI / 4) * maxIncrement * angleDirection,

This does not work as expected and the ship spins in unexpected directions. Is there a general methodology for controlling yaw and roll of a flying vehicle?

Yes, there is an order of multiplication when using quaternions. Quaternion multiplication is not commutative, meaning the order in which you multiply them matters.

Can you share a Playground with a small reproduction of your setup? :slight_smile:

1 Like

@carolhmj Here’s a playground showing what I have so far: Babylon.js Playground

Line 86-95 is where the rotation code lives.

@CodingCrusader Any suggestions on methodologies for combining rotations consistently?

You’ll find a lot of tutorials on youtube about this topic if you search for “quaternions” e.g.

Gimbal Lock And Quaternions - Three.js Tutorial (youtube.com)

And look at the warning in the documentation

You cannot use a rotationQuaternion followed by a rotation on the same mesh. Once a rotationQuaternion is applied any subsequent use of rotation will produce the wrong orientation, unless the rotationQuaternion is first set to null. Please be aware this often applies when importing models as many of these models already have a rotationQuaternion set.

Rotation Quaternions | Babylon.js Documentation (babylonjs.com)