Change direction for Z axe in gizmos

Questions
1

hello ,

i’m using gizmos for some mesh in my scene and i have some result like this :
https://www.babylonjs-playground.com/#31M2AP#48

any help to change direction Z axe (blue axe ) ==> direction to user.

thanks for help :slight_smile:

2

I think it could be a nice feature to implement. I don’t think it is currently supported thou.

You could implement it yourself - something along the lines of this:

https://www.babylonjs-playground.com/#31M2AP#88

Notice that I dispose the old z axis drag gizmo and add one myself in the right normal (-1 on the z instead of 1)

2 Likes
3

thanks @RaananW for help :slight_smile:

4

@RaananW Sorry for the inconvenience, but I have another question about gizmos: can I change the thickness of the gizmos’ axes?
thank you :slight_smile:

5

If you ask so nicely anything is possible! :slight_smile:

If you use javascript, you could use the fact that the are no private variables in javascript:

https://www.babylonjs-playground.com/#31M2AP#96

If you use typescript, you will need to find the right mesh in the utilityLayerScene and scale this mesh.

2 Likes
6

sorry @RaananW but you are changing the size of the axes not their thicknesses

7

I am just showing you how you can manipulate the root mesh of the gizmo.

The mesh is being built this way:

public static _CreateArrow(scene: Scene, material: StandardMaterial): TransformNode {
        var arrow = new TransformNode("arrow", scene);
        var cylinder = CylinderBuilder.CreateCylinder("cylinder", { diameterTop: 0, height: 0.075, diameterBottom: 0.0375, tessellation: 96 }, scene);
        var line = CylinderBuilder.CreateCylinder("cylinder", { diameterTop: 0.005, height: 0.275, diameterBottom: 0.005, tessellation: 96 }, scene);
        line.material = material;
        cylinder.parent = arrow;
        line.parent = arrow;

        // Position arrow pointing in its drag axis
        cylinder.material = material;
        cylinder.rotation.x = Math.PI / 2;
        cylinder.position.z += 0.3;
        line.position.z += 0.275 / 2;
        line.rotation.x = Math.PI / 2;
        return arrow;
    }

So _arrow is this arrow object. it has two children, and you can get them using _arrow.getChildren(). I don’t know exactly what you want to do, but this would be the one way you can do this.

1 Like
8

thanks for the explanation and aslo for your time,
I just want to enlarge the thickness of the axes (Thicker).