Babylonjs tooltip examples playground

Hi there
I did a lot of research, but I could not reach the desired result. Can you leave the tooltip examples you have or find as a playground for other people to use? Thanks to the community for their help.

1 Like

Hi,

Are you looking for 2D GUI tooltips? If so, you may enjoy @msDestiny14’s excellent writeup on creating “Battle Boats”, which includes this functionality: Battle Boats— A Beginner’s GUIde! | by Babylon.js | Medium

If you want to use something else to render the tooltip (eg. 3D GUI or HTML), let me know and I can point you in the right direction :slight_smile:

3 Likes

@DarraghBurke Thanks for your answer. Yes, as you said, I made a design using HTML, but the rectangle I created in babylonjs does not move. My sample is not shrinking or growing. I can’t make the positioning dynamic. I tried typing html inside the rectangle to solve this but failed. Please advise on this matter.

You may be interested in this thread: How to know if the html attached to the mesh is facing back

The playground shared by the OP should give you an idea how you can attach an HTML element to a 3D mesh. There is also some discussion about occluding the element if it’s behind something in your scene, though there isn’t a perfect solution for that.

I recommend checking out @syntheticmagus 's amazing e-commerce experience guide as he talks about setting up tooltips/hotspots there too :slight_smile: 3D for E-Commerce - Custom Experience | Babylon.js Documentation (babylonjs.com)

1 Like