Texts are flipped on my setup

Questions
1

Hello. I am experiencing a problem in my setup, I am using react to piece up a scene with gltf assets and a json spec. My issue is with the text. The text looks flipped for some reason and I require a rotation to unflip the text yet this is not the case in the playground. I think the issue could be my camera is flipped somehow. Here is my camera setup. Also worthy to say I am using DynamicTexture to load text on price labels and it is flipped too but I fix this by applying a rotation. But this text is part of gltf texture, I don’t think I can rotate it.

let position = new BABYLON.Vector3(-2, 1, 8)

        const camera = new BABYLON.UniversalCamera(
            'UniversalCamera',
            position,
            this._scene
        )

        camera.speed = 0.2
        camera.minZ = 0.1
        camera.applyGravity = true
        camera.ellipsoid = new BABYLON.Vector3(0.4, 0.6, 0.4)
        camera.checkCollisions = true


        // Targets the camera to a particular position. In this case the scene origin
        camera.setTarget(new BABYLON.Vector3(0, 1.7, 0))

        this._scene.activeCamera.attachControl(this._canvas)

Here is a snap of how shelf looks in my setup as opposed to babylon viewer.

wrong.PNG
wrong.PNG1019Ă—200 58.1 KB
right
right940Ă—318 29.3 KB

2

You can change the coordinate system to right-handed or left handed

scene.useRightHandedSystem = true;

or you can change u scale of texture in reverse order
bottleLableMat.diffuseTexture.uScale = scene.useRightHandedSystem ? -1 : 1;

3

thanks @HiteshSahu scene.useRightHandedSystem = true; fixes all gltf flipping issues. But now flips my DynamicTexture and removing the rotations doesn’t get it fixed.
wrong

4

See the second part of the answer. uscale =-1 flips the texture horizontally.

5

The text just disappears…
wrong

6

Try setting mat.backFaceCulling = false and do not set uScale

With backFaceCulling set false it will be flipped on one side like looking text from the backside and on the other side text will be in the right order. Now you need to set proper rotation of the mesh

https://www.babylonjs-playground.com/#TMHF80#231

image
image714Ă—544 7.75 KB

image

2 Likes
8

thanks @HiteshSahu works like a charm.

2 Likes