# GUI (Plane rotation around mesh)

**URL:** <https://forum.babylonjs.com/t/gui-plane-rotation-around-mesh/22554>\
**Category:** Questions\
**Tags:** gui, button, billboard\
**Created:** [July 22, 2021, 3:05pm UTC](https://forum.babylonjs.com/t/gui-plane-rotation-around-mesh/22554 "2021-07-22T15:05:56Z")\
**Posts on this page:** 9\
**Page:** 1

<div class="post-metadata">

**Author:** ![Naznarok](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/naznarok/32/24976_2.png) [@Naznarok](https://forum.babylonjs.com/u/Naznarok)\
**Post date:** [July 22, 2021, 3:05pm UTC](https://forum.babylonjs.com/t/gui-plane-rotation-around-mesh/22554/1 "2021-07-22T15:05:56Z")

</div>

Hello! I’m trying to recreate UI mechanic shown on this [Video](https://www.loom.com/share/95b036bc9255487a981fb5c5adcbae91). I cant figure out how to rotate Plane around Mesh. I would be grateful for your help 🙂

[Playground](https://playground.babylonjs.com/#5UM4PX#4)  
[Screenshot](https://d.radikal.ru/d15/2107/e6/34d99d3a05c5.png)

---

<div class="post-metadata">

**Author:** ![sebavan](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/sebavan/32/57_2.png) [@sebavan](https://forum.babylonjs.com/u/sebavan)\
**Post date:** [July 22, 2021, 3:34pm UTC](https://forum.babylonjs.com/t/gui-plane-rotation-around-mesh/22554/2 "2021-07-22T15:34:20Z")

</div>

Adding @msDestiny14

---

<div class="post-metadata">

**Author:** ![sebavan](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/sebavan/32/57_2.png) [@sebavan](https://forum.babylonjs.com/u/sebavan)\
**Post date:** [July 22, 2021, 3:34pm UTC](https://forum.babylonjs.com/t/gui-plane-rotation-around-mesh/22554/3 "2021-07-22T15:34:23Z")

</div>



---

<div class="post-metadata">

**Author:** ![bghgary](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/bghgary/32/48532_2.png) [@bghgary](https://forum.babylonjs.com/u/bghgary)\
**Post date:** [July 22, 2021, 9:26pm UTC](https://forum.babylonjs.com/t/gui-plane-rotation-around-mesh/22554/4 "2021-07-22T21:26:14Z")

</div>

Without billboarding, you can typically just add a parent to the plane and then you can rotate the parent.  
[https://playground.babylonjs.com/#H36NXK#1](https://playground.babylonjs.com/#H36NXK#1)

With billboarding, [parent rotations don’t work](https://forum.babylonjs.com/t/solved-how-to-use-babylon-mesh-billboardmode-all-properly/3999/8) (Thanks @Evgeni_Popov for investigating!)

But you can use an invisible node and copy the position over, like this:  
[https://playground.babylonjs.com/#H36NXK#2](https://playground.babylonjs.com/#H36NXK#2)

---

<div class="post-metadata">

**Author:** ![Naznarok](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/naznarok/32/24976_2.png) [@Naznarok](https://forum.babylonjs.com/u/Naznarok)\
**Post date:** [July 22, 2021, 10:07pm UTC](https://forum.babylonjs.com/t/gui-plane-rotation-around-mesh/22554/5 "2021-07-22T22:07:21Z")

</div>

Thank you for your quick response! Updated [playground](https://playground.babylonjs.com/#5UM4PX#19). Maybe there is a cleaner solution?

---

<div class="post-metadata">

**Author:** ![msDestiny14](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/msdestiny14/32/9572_2.png) [@msDestiny14](https://forum.babylonjs.com/u/msDestiny14)\
**Post date:** [August 9, 2021, 4:30pm UTC](https://forum.babylonjs.com/t/gui-plane-rotation-around-mesh/22554/6 "2021-08-09T16:30:30Z")

</div>



---

<div class="post-metadata">

**Author:** ![brightMoon](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/brightmoon/32/9959_2.png) [@brightMoon](https://forum.babylonjs.com/u/brightMoon)\
**Post date:** [September 14, 2022, 5:46am UTC](https://forum.babylonjs.com/t/gui-plane-rotation-around-mesh/22554/7 "2022-09-14T05:46:55Z")

</div>

Have you found a simple solution?

---

<div class="post-metadata">

**Author:** ![sebavan](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/sebavan/32/57_2.png) [@sebavan](https://forum.babylonjs.com/u/sebavan)\
**Post date:** [September 14, 2022, 2:05pm UTC](https://forum.babylonjs.com/t/gui-plane-rotation-around-mesh/22554/8 "2022-09-14T14:05:35Z")

</div>

Yup have a look at the 2 previous answers. Is anything missing ?

---

<div class="post-metadata">

**Author:** ![Naznarok](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/naznarok/32/24976_2.png) [@Naznarok](https://forum.babylonjs.com/u/Naznarok)\
**Post date:** [January 29, 2023, 8:42pm UTC](https://forum.babylonjs.com/t/gui-plane-rotation-around-mesh/22554/9 "2023-01-29T20:42:18Z")

</div>

[Babylon GUI (Plane Buttons) | Babylon.js Playground (babylonjs.com)](https://playground.babylonjs.com/#5UM4PX#50)

We can close this thread, thx you all for help ive got what i wanted long time ago.
