How to get X,Y and Z labels attached to axes?

Hello,

Is it possible to create a fixed size coordinate system in the bottom left of a scene with XYZ labels?

Like AxesViewer but with end labels too that follows the arrows.

coordinate example

Here is an example repo.

https://playground.babylonjs.com/#QXHNNN#11

Thanks!

You could do like this Display World Axes | Babylon.js Documentation

Thanks sebavan. I have also looked at the example. How could I get the coordinate system to get located in the bottom left corner and be locked in size? So its similar to AxesViewer.

Hi

I will try to fill in here and see if it helps.
We are looking for a way to get the AxesViewer to be fixed down in the left corner when the object is moved in the picture, with fixed i mean that it should still rotate and follow the objects coordinate but should not move around in the picture / space like in the above example.
Should more work like in an CAD software.
See attached picture if it helps.

And also in some way if its possible to get the axis labels fixed in the end of the arrows for each axis, X, Y & Z.

Many thanks

Adding @Cedric who is magic with Gizmo in case he has a clue.

something like this ?
https://playground.babylonjs.com/#QXHNNN#11

For the axis display, I would do 3 small dynamic textures with text rendered and create 3 planes with billboard.
PG with text plane : https://www.babylonjs-playground.com/#TMHF80#10
PG with billboard examples : https://www.babylonjs-playground.com/#H7DRX6#3

1 Like

and yet another one : Babylon.js Playground
you will have to mix those different PGs according to your needs :slight_smile:

Hello Cedric, yes. Could you create an example for this with 3 small dynamic textures that follow the AxesViewer? Very much appreciated!

Iā€™m really busy ATM but I can answer questions or try to help.

Hi Cedric

Thanks for your replay.
I have changed the code a bit now so now i have managed to get the axis viewer down in the left corner together with my other axis viewer.
But i can not get down the labels there.
Do you have any idea how to do that?

Thanks

https://playground.babylonjs.com/#QXHNNN#16

Here is a new version that displays the letter above axes.

image

AxesViewer With Cursor Zoom | Babylon.js Playground (babylonjs.com)

1 Like

Here is the working link

https://playground.babylonjs.com/#QXHNNN#25

2 Likes

Improved version of the solution.

https://playground.babylonjs.com/#QXHNNN#30

1 Like