How to grab new vector position after rotating the gizmo?

Questions
1

Lets suppose I initially have a vector pointing to 0,0,1 and after rotating the gizmo of a mesh I have a new vector pointing at the rotated position
How to get new vector position after rotating the gizmo?

var spheredrag2pointerDragBehavior = new BABYLON.PointerDragBehavior({dragPlaneNormal: new BABYLON.Vector3(0,0,1)});
framegizmoManager.gizmos.rotationGizmo.zGizmo.dragBehavior.onDragEndObservable.add((mesh)=>{
if (mesh) {
spheredrag2pointerDragBehavior._options.dragPlaneNormal= new BABYLON.Vector3();
}
});

2

Hi @mathus1,

If you pack your code in a playground we will be able to help much better.

In general, any vector that was updated (and that is public) can be read after the drag has ended. But it would be great to know what exactly you are trying to achieve, in order to help further.

3

Here is the playground Babylon.js Playground

I would like to make a draggable frame that can be rotated and drawn by the spheres always in parallel to the plane. Press 2 to activate the rotation

4

And also when I extend the frame, the frame is not selectable in the new created areas
See this playground: https://playground.babylonjs.com/#61ZCLZ#1

5

Is there any solution for these 2 problems?

6

If you call refreshBoundingInfo() on the mesh after applying the new geometry to it, like on line 123 below, then the mesh is properly selectable. :slight_smile: For the other issue thou, I’m not sure which part(s) isn’t working as intended?

1 Like
7

Thank you for solving the first issue. The second problem actually is that I want to update the dragPlaneNormal vector after rotating the gizmo. I would like to make a draggable frame that can be rotated and drawn by the spheres, always parallel to the plane.

var spheredrag2pointerDragBehavior = new BABYLON.PointerDragBehavior({dragPlaneNormal: new BABYLON.Vector3(0,0,1)});
framegizmoManager.gizmos.rotationGizmo.zGizmo.dragBehavior.onDragEndObservable.add((mesh)=>{
if (mesh) {
spheredrag2pointerDragBehavior._options.dragPlaneNormal= **new BABYLON.Vector3();**
}
});

Is there a function to do this?

8

ah There is another thing. If you press the key “2”, the rotating gizmo will appear at the top of the mesh. How to position the rotation feature at the center of the mesh?

9

cc @Cedric

10

The gizmo is located at the origin of the mesh: the local 0,0,0
To locate it at the center of the mesh, I woudl compute the bouding box and add an intermediate transform at the location. Then, I would attach the gizmo to the intermediate transform.

1 Like
11

What is the command to compute the bounding box?
Could you give an example in the previous playground? or using a simpler playground?

12

Here is a quick example:

centered gizmo | Babylon.js Playground (babylonjs.com)

The gizmo manipulates node transform. when it’s dragged, it updates Y rotation on the box.
If you set the gizmo on the box, you will see it’s not centered.

1 Like
13

Thank you. The gizmo position problem was solved. Now I just need to update the dragPlaneNormal of the spheres so that the sphere can move always parallel to the frame. Can you help me with this?

14

I can try to find solutions to very specific problems

15

In this case, the vector initially points at 0 0 1 and as I rotate the gizmo, the vector should be changed. For example, if I rotate 45 degrees, the new vector should be 0.707 0 0.707.
90 degrees => 1 0 0.
180 degrees => 0 0 -1.
270 degrees => -1 0 0 .
how to call the gizmo rotation angle to get the new vector?

var spheredrag2pointerDragBehavior = new BABYLON.PointerDragBehavior({dragPlaneNormal: new BABYLON.Vector3(0,0,1)});
framegizmoManager.gizmos.rotationGizmo.zGizmo.dragBehavior.onDragEndObservable.add((mesh)=>{
if (mesh) {
spheredrag2pointerDragBehavior._options.dragPlaneNormal= ???
}
});
16

You can get the angle from the gizmo of the rotation from the attached node

centered gizmo | Babylon.js Playground (babylonjs.com)

17

Thank you. Problem solved

1 Like