Rotating of meshes in MeshButton3D

Hey,

I want to create a cylinder panel with imported meshes as MeshButton3D when I click on a ground plane. It works quite well, the only thing is, that the rotation of the meshes is set to (0, something, 0) after I add the button to the panel. It seems like the rotation is set correctly at first and then after the first render call it is set to (x: 0, y: something, z:0) Any clue why this happens? Any help is appreciated :slight_smile:

I tried to extract most things which are not necessary and used just created cones instead of imported meshes and made a PG here https://www.babylonjs-playground.com/#TVXJY5

When you click anywhere on the ground two buttons as Cones will be created in the panel, but they have no rotation, which I hoped to get by Line76

The panel meshes are going to re-position automatically by rows/columns (thatā€™s what you are seeing in the render ā€œafter first renderā€). If you set the rows to 1 then is that what you are after?
https://www.babylonjs-playground.com/#TVXJY5#1

Unfortunately not, the cones are not rotated either, when setting the rows to 1. What I want to achieve is, that they are rotated like the big cone in the middle of the scene. I placed it there as a visual ā€œreferenceā€.

I just got a solution. https://www.babylonjs-playground.com/#TVXJY5#3 If I do the rotation inside a registerBeforeRender it works but I do not really get why this is necessary since e.g. scaling works without (uncomment line 78 to see the scaled buttons).

Hiya Sorebrez, welcome to the BJS forum!

https://www.babylonjs-playground.com/#TVXJY5#6

Wingnut goofing around. I took ā€˜coneā€™ OUT-OF the pointerDown handlerā€¦ and put it up at line 52.

Then I did my rotatingā€¦ in line 53, and baked that rotation into permanenceā€¦ with line 54.

Down at line 82, weā€™re still cloning, as before.

Unfortunately, this rotateā€™nā€™bake thingā€¦ is affecting the automatic spacing of the buttons in the cylinderPanel. It is confusing the auto-spacerā€¦ so that the cones-circle is overlapping itself.

With only 5 cones per cones-circle, it looks pretty good. https://www.babylonjs-playground.com/#TVXJY5#7 (disabled lines 102-104)

It also looks ok with 32 cones in the cone-circle. :open_mouth: https://www.babylonjs-playground.com/#TVXJY5#8

Not much learned or solved by me, sorry. Do these 3D GUI panels have left/right padding? Or maybe cylinderPanels have a manualRotationalOffset property? I donā€™t know very much about them. But it appears that we have ā€œfaked-outā€ the automatic rotation-spacerā€¦ by doing the rotationā€™nā€™bake in lines 53/54.

In general, I saw no reason to make a new clone-mama (cone) every time a pointDown happenedā€¦ so I moved it out to done-once land. The scene feels a little less memory-leaky, now.

Stay tuned for more/wiser comments, and teach us stuff ya learn, ok Sorebez? Thx! :slight_smile:

1 Like

Hey Wingnut,

amazing :slight_smile:
I wasnt aware of baking transformations. After reading about it, the behavior makes sense to me and your solution also. I am not very concerned about the spacing because in my real case the models are quire unregular and different from each other. I always will not build a full circle, so they wonā€™t overlap.

You are also right about that cloning, this was a mistake from copying things back and forth while creating the PG, so everythings fine there.

So, implemented it by now for my project and it works like a charm. Did it with a rotation Matrix, just for the learning :slight_smile: Thanks @Wingnut

1 Like