Can't understand rotations pivot points

Questions
1

Hello Everyone,

I have a small problem with rotations especially the position of the pivot point. It should be quite obvious for most of you but my brain can’t figure it out.

https://playground.babylonjs.com/#ZIBQC3#1

You can see I have 3 meshes, 2 of them are extruded, 1 is a box. What I need to do is rotate around the X axis so the polygon is facing the camera, then rotate on Z axis. The box (grey) has the correct behavior, but it’s because I didn’t rotate it on the X axis prior to the Z axis. The purple polygon is also rotating as expected (Z axis), again because I didn’t rotate it on the X axis. On the other hand, the blue polygon seems to have it’s pivot point far from it’s center, and after rotating it on X axis, the rotation on Z axis is unintended. I Can reproduce this behavior with a box as long as I place it in a position where it needs to be rotated on X prior to Z.

I have tried setPivot or setPivotMatrix without any success. It seems the rotation point for Z is not centered on my mesh.

What am I doing wrong ?

Thanks.

2

hi
normally rotation work on the local pivot ( 0,0,0 )
https://playground.babylonjs.com/#ZIBQC3#2

i use parent child system for make local rotation
https://playground.babylonjs.com/#ZIBQC3#3

but you can manage that by pivot too
https://playground.babylonjs.com/#ZIBQC3#5

3

Thanks for your quick reply, I already tried moving the pivot point with setPivotMatrix, but I shouldn’t have to do that because after rotating on X, rotating on Z should use the same pivot point. I guess I wasn’t very clear to describe my problem so here is another playground :
https://playground.babylonjs.com/#ZIBQC3#6

What I’m trying to achieve is the behavior of the box (grey), rotating on Z as intended. But as soon as I apply a X rotation (which shouldn’t move the pivot point right ?) then rotation on Z is the same as rotating on Y, and rotating on Y is even weirder like the pivot point is now away from the center of the polygon. I guess it has something to do with the depth but I don’t see what.

4

i dont get it but is this you want?
https://playground.babylonjs.com/#ZIBQC3#7

5

I have to work on my english :wink:

In my previous playground, what I intended to say was :

  • The grey shape is what I want to produce.
  • The blue shape is doing weird things when I try to reproduce the grey rotation because with the blue shape I also need to rotate on X (so it’s facing the camera) and rotate on Z to obtain the same visual as with the grey.

Basically I want the two shapes to be like the grey one, rotating exactly the same way and facing the camera the same way.

6

An easy solution is to bake the x rotation into the vertices, if it is an option for you:

https://playground.babylonjs.com/#ZIBQC3#8

7

Without baking:

https://playground.babylonjs.com/#ZIBQC3#9

8

Thanks, exactly what I wanted.

I will bake the meshes just after creation, because that’s the position and rotation they will be from the beginning. I only apply the X rotation at the beginning juste because I don’t want to go into the extrude path which is tricky but gives me exactly what I need.

I guess the bake is a way to flat all transformations to a mesh, I’ll go inform myself about that in the doc.

Thanks again.

1 Like