How to use billboardmode properly under right-hand system?

Bugs
1

Hi there,

Recently i am trying to introduce the billboard for some labels in the scene.

For some reason, we are using right hand system (with z up) in scene.

And it seems the billboardmode does not like it.

Babylon.js Playground

Please find the PG above.

For the plane 2 with billboardmode off, the position is as expected and the axis are correctly positioned.

image
image908Ă—704 15 KB

For plane 1 with billboardmode on, the position is wrong with text flipped, and when checking its axis, it is bounced back to the lefthand system.

image
image792Ă—624 13 KB

I am not sure if it is a bug. And wonder if there is any way to compensate the change to make the billboard mode also working as expected in the right hand system.

Thanks.

2

Nice catch!

But when you say the position is wrong this is not true. You have this code:

    plane.position.y = 10;
    
    // plane.bakeCurrentTransformIntoVertices();
    plane.billboardMode = BABYLON.Mesh.BILLBOARDMODE_ALL;   
    plane.parent = box;

So plane has a parent (the box) so its position is 10 on Y from the parent position.

That being said, we have a bug fixed here (the orientation was wrong):
Fix incorrect rotation in billboard mode RH by deltakosh · Pull Request #16694 · BabylonJS/Babylon.js

1 Like
3

Thanks @Deltakosh as usual.

When i say the position is wrong, is that the parent box Y-axis is towards in-screen. If you take a look from the parent box’s perspective, Both planes are actually have the same Y offset from their parents. But with billboard mode on, plane2 is positioned incorrectly based on my understanding. It should stand behind the box other than above the box.

**

image
image639Ă—604 10.5 KB

**

4

Oh I see what you wanted :slight_smile:
Add that please:

    plane.preserveParentRotationForBillboard = true;
5

Thanks.

I searched this property and found some relevant case.
billboardMode on a gltf assets doesn’t works as it should - Bugs - Babylon.js

I am kind facing the same issue. When this property enabled, it basically disabled the billboard mode…

Currently I am doing some manual mapping from a parented “normal” plane to a “billboard” mode plane. I still keep the same hirachicy as its logically should look like. Thus I did not use the trick suggest in the link above (create dummy parent).

Set a Pivot | Babylon.js Playground

Which seems working alright…

image
image1254Ă—945 20.5 KB

Not sure if the situation will get better with your fix. Will try it out later.

6

You are right! there is a bug!!

Let me dig into that!

7

Man! I got myself confused by our own API lol

here is the solution:
BillboardUseParentOrientation

I’m sorry it took so long (text orientation will be fixed by my PR).

I will improve our documentation right away!

2 Likes
8

Thanks @Deltakosh . This configuration works, will test out the text issue later.

1 Like