# Left and Right Handed shenanagins

**URL:** <https://forum.babylonjs.com/t/left-and-right-handed-shenanagins/17049>\
**Category:** Questions\
**Created:** [December 31, 2020, 2:04pm UTC](https://forum.babylonjs.com/t/left-and-right-handed-shenanagins/17049 "2020-12-31T14:04:14Z")\
**Posts on this page:** 13\
**Page:** 1

<div class="post-metadata">

**Author:** ![slimboX](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/slimbox/32/37266_2.png) [@slimboX](https://forum.babylonjs.com/u/slimboX)\
**Post date:** [December 31, 2020, 2:04pm UTC](https://forum.babylonjs.com/t/left-and-right-handed-shenanagins/17049/1 "2020-12-31T14:04:14Z")

</div>

BabylonJS is so cool I cannot sleep at night. But what is up with the coordinate system.

So I’m importing gltf models from Maya into Babylon scene. Setting up the camera I notice the coordinates seem to be backwards, but my models looks correct. Placing some GUI elements, same backwards coordinates. Hmmm…

So now I activate billboard mode on some of the imported mesh and they flip into this backwards coordinate system. ACK!

So I learn how to get the inspector in my scene and discover this weird “_root_” node with a negative Z scale. Ack again.

So now I learn about this lefthanded or righthanded system for gltf and my head is spinning.

Using the scene.useRightHandedSystem = true; switch makes my scene work EXCEPT I have to flip a few things that I added through code, which are now backwards. Not a big deal.

Did I do this the correct way, by using the scene.useRightHandedSystem = true ? The BILLBOARD seems to not work correctly in lefthanded mode, at least not with imported gltf models from Maya.

---

<div class="post-metadata">

**Author:** ![sebavan](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/sebavan/32/57_2.png) [@sebavan](https://forum.babylonjs.com/u/sebavan)\
**Post date:** [December 31, 2020, 2:49pm UTC](https://forum.babylonjs.com/t/left-and-right-handed-shenanagins/17049/2 "2020-12-31T14:49:05Z")

</div>

It should work both ways as the intent of the **root** is actually to flip the model back.

You could set the useRightHandedSystem if you prefer to work as such but yes as long as there are no normalization of coordinates system it is a tough topic 🙂

---

<div class="post-metadata">

**Author:** ![slimboX](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/slimbox/32/37266_2.png) [@slimboX](https://forum.babylonjs.com/u/slimboX)\
**Post date:** [December 31, 2020, 5:00pm UTC](https://forum.babylonjs.com/t/left-and-right-handed-shenanagins/17049/3 "2020-12-31T17:00:03Z")

</div>

The mesh I’m affecting with the billboard is under the flipped root, causing it to flip in all 3 directions (I think all 3). I’ll setup a PG example when I can.

---

<div class="post-metadata">

**Author:** ![Mati](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/mati/32/19292_2.png) [@Mati](https://forum.babylonjs.com/u/Mati)\
**Post date:** [May 27, 2022, 11:02am UTC](https://forum.babylonjs.com/t/left-and-right-handed-shenanagins/17049/4 "2022-05-27T11:02:49Z")

</div>

Adding onto that, I’ve had a similar issue while trying to import multiple GLBs which were previously arranged in Unity. My models were rotated wrong way round because I needed to apply the rotation to the root elements and thus was overwriting the right-hand left-hand rotation conversion.

Turns out the Unity GLTF plugin converts right-hand to left-hand by flipping the X axis and the Babylon GLTFLoader does that by flipping the Z axis and rotating 180 in Y.

[**Unity Khronos plugin**](https://github.com/KhronosGroup/UnityGLTF/blob/1e003333698be2d6026211c2ee85ddbd25d07b72/UnityGLTF/Assets/UnityGLTF/Runtime/Scripts/Extensions/SchemaExtensions.cs)

 ![image](https://us1.discourse-cdn.com/flex024/uploads/babylonjs/original/3X/d/2/d25c24f980ef2eb522b8256180c9eb298f30317c.jpeg)

[**Babylon GLTF loader**](https://github.com/BabylonJS/Babylon.js/blob/f71551a2015c056a6581b661d6bed07eb950654f/packages/dev/loaders/src/glTF/2.0/glTFLoader.ts)

 ![image](https://us1.discourse-cdn.com/flex024/uploads/babylonjs/original/3X/a/9/a9aea1f4fc863526c956fb5c8402e0d84467663f.jpeg)

**Workaround**  
I managed to work around this issue by overwriting the root scaling vector with Vector3(-1,1,1) and overwriting the root rotation to the desired one or if no rotation was desired then resetting it to 0.

Simplified code is below and playground [here](https://playground.babylonjs.com/#NPZ0W1).

```auto
const desiredRotation = new BABYLON.Quaternion(x,y,z,w);
const manager = new BABYLON.AssetsManager(scene);
const task = manager.addMeshTask("meshTask", "", "scenes/BoomBox/", "BoomBox.gltf");
    
task.onSuccess = () => {
    const mesh = task.loadedMeshes.find(mesh => mesh.id === ' __root__');
    mesh.rotationQuaternion = desiredRotation ?? BABYLON.Quaternion.Identity();
    mesh.scaling = new BABYLON.Vector3(-1,1,1);
}

```

**Question**  
Would it be possible to either change the behaviour of the GLTFLoader in such way that -X scaling is applied instead of the -Z scaling and Y rotation OR create a third case entry in the GLTFLoaderCoordinateSystemMode and handle the new case in the GLTFLoader?

I’m happy to help with implementation just wanted to get some input from contributors first 😃

---

<div class="post-metadata">

**Author:** ![Deltakosh](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/deltakosh/32/26635_2.png) [@Deltakosh](https://forum.babylonjs.com/u/Deltakosh)\
**Post date:** [May 27, 2022, 2:29pm UTC](https://forum.babylonjs.com/t/left-and-right-handed-shenanagins/17049/5 "2022-05-27T14:29:51Z")

</div>

cc @bghgary

---

<div class="post-metadata">

**Author:** ![bghgary](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/bghgary/32/48532_2.png) [@bghgary](https://forum.babylonjs.com/u/bghgary)\
**Post date:** [May 27, 2022, 3:45pm UTC](https://forum.babylonjs.com/t/left-and-right-handed-shenanagins/17049/6 "2022-05-27T15:45:21Z")

</div>

> [@Mati](#):
>
> Would it be possible to either change the behaviour of the GLTFLoader in such way that -X scaling is applied instead of the -Z scaling and Y rotation OR create a third case entry in the GLTFLoaderCoordinateSystemMode and handle the new case in the GLTFLoader?

-Z scale and a 180 degree rotation is equivalent to -X scale. The reason it’s not -X scale is because I didn’t realize initially that -X scale is simpler and because of backwards compatibility. We can add an enum entry to change this, but you can also easily achieve what you want by using the correct math.

PG: [https://playground.babylonjs.com/#NPZ0W1#1](https://playground.babylonjs.com/#NPZ0W1#1)

---

<div class="post-metadata">

**Author:** ![Mati](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/mati/32/19292_2.png) [@Mati](https://forum.babylonjs.com/u/Mati)\
**Post date:** [May 27, 2022, 4:27pm UTC](https://forum.babylonjs.com/t/left-and-right-handed-shenanagins/17049/7 "2022-05-27T16:27:06Z")

</div>

To me personally having that extra enum would be much more clear, I spent a fair amount of time trying to figure out why my rotations from Unity don’t produce the same result in Babylon.

Multiplying the quaternion works but the side effect of that is an ‘incorrect’ rotation in Y axis. Say I set the rotation to 45 degrees in Y, the resulting rotation of the root will be -135 degrees.

 ![image](https://us1.discourse-cdn.com/flex024/uploads/babylonjs/original/3X/1/f/1f784366c75abd40d8bf9477057d676b62be701d.jpeg)

PG: [https://playground.babylonjs.com/#NPZ0W1#2](https://playground.babylonjs.com/#NPZ0W1#2)

Also adding extra info about this to the [doc](https://doc.babylonjs.com/divingDeeper/importers/glTF) would be a lot of help for newbies like me 🙂

If you are happy with this I will open an issue in GH

---

<div class="post-metadata">

**Author:** ![bghgary](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/bghgary/32/48532_2.png) [@bghgary](https://forum.babylonjs.com/u/bghgary)\
**Post date:** [May 27, 2022, 4:44pm UTC](https://forum.babylonjs.com/t/left-and-right-handed-shenanagins/17049/8 "2022-05-27T16:44:35Z")

</div>

> [@Mati](#):
>
> Multiplying the quaternion works but the side effect of that is an ‘incorrect’ rotation in Y axis. Say I set the rotation to 45 degrees in Y, the resulting rotation of the root will be -135 degrees.

This is all just conventions at the end of the day. If you really want it to be easy to understand, I suggest adding another transform node above the root to apply your transforms. The ` __root__ ` node is there to do the right-hand to left-hand conversion.

> [@Mati](#):
>
> If you are happy with this I will open an issue in GH

I’m not sure if you mean the doc or the code.

---

<div class="post-metadata">

**Author:** ![Mati](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/mati/32/19292_2.png) [@Mati](https://forum.babylonjs.com/u/Mati)\
**Post date:** [May 27, 2022, 4:59pm UTC](https://forum.babylonjs.com/t/left-and-right-handed-shenanagins/17049/9 "2022-05-27T16:59:27Z")

</div>

> [@bghgary](#):
>
> This is all just conventions at the end of the day. If you really want it to be easy to understand, I suggest adding another transform node above the root to apply your transforms. The ` __root__ ` node is there to do the right-hand to left-hand conversion.

Fair enough 👍

> [@bghgary](#):
>
> I’m not sure if you mean the doc or the code.

I meant both, but taking the above into account I guess the doc would be enough.

---

<div class="post-metadata">

**Author:** ![carolhmj](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/carolhmj/32/25918_2.png) [@carolhmj](https://forum.babylonjs.com/u/carolhmj)\
**Post date:** [June 24, 2022, 1:12pm UTC](https://forum.babylonjs.com/t/left-and-right-handed-shenanagins/17049/10 "2022-06-24T13:12:10Z")

</div>

I see no problem with opening an issue on the docs repo, or if you’d like to add your own contribution to the docs it would be even more awesome!

---

<div class="post-metadata">

**Author:** ![mawa](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/mawa/32/12384_2.png) [@mawa](https://forum.babylonjs.com/u/mawa)\
**Post date:** [June 24, 2022, 1:18pm UTC](https://forum.babylonjs.com/t/left-and-right-handed-shenanagins/17049/11 "2022-06-24T13:18:29Z")

</div>

> [@bghgary](#):
>
> This is all just conventions at the end of the day

There we go. Contribution to the doc, code or any twist is welcomed. But the real contribution we would need is to just stop the crap and have everyone on the same line. GL with this 😉 Anyone who will undertake this mission will instantly become my Hero 🦸‍♂️ 😃

---

<div class="post-metadata">

**Author:** ![Mati](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/mati/32/19292_2.png) [@Mati](https://forum.babylonjs.com/u/Mati)\
**Post date:** [June 24, 2022, 1:34pm UTC](https://forum.babylonjs.com/t/left-and-right-handed-shenanagins/17049/12 "2022-06-24T13:34:32Z")

</div>

Sure! I will try get something proposed on the docs repo soon 😃

---

<div class="post-metadata">

**Author:** ![Chimpy](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/chimpy/32/32252_2.png) [@Chimpy](https://forum.babylonjs.com/u/Chimpy)\
**Post date:** [July 13, 2023, 7:58pm UTC](https://forum.babylonjs.com/t/left-and-right-handed-shenanagins/17049/13 "2023-07-13T19:58:52Z")

</div>

Wow, this likely saved me a ton of time and headaches. I was having trouble with an imported hand mesh. The hand would always be the left hand, even though I exported it in Blender as a right hand. Long story short, I got left and right hands by using the line “scene.useRightHandedSystem = true;” (turned both hands into right hands) and then for my left handed hand mesh I added a negative x value during scaling- `leftControllerMesh.scaling = new BABYLON.Vector3(-0.0025, 0.0025, 0.0025);`

Thanks Mati ! 🍻 🚬
