Hello, everybody, I’m standing in front of a project with a very complex user interface and of course I know that BABYLON brings its own GUI system, but I’m afraid I can’t avoid building the UI in HTML. But first I wanted to ask if there are any reasons against it. Performance slumps for example. …

Hi Steffen, First of all if you want your UI to be available in VR mode Babylon GUI is the only choice you have. Now if VR is not required there are 2 cases : Screen mode (= 2D) If you need simple UI - a menu for example - you can (should) use HTML/CSS. There’s no performance issue and it’s mor…

Thanks a lot for all the fast requests. The UI iam planning is a tpical, as you called it, screenmode UI. The main menu and more or less complex diolog boxes ontop of the babylon canvas. So my plan was to do a wrapper div element for the ui and put it ontop with position absolute and an higher zind…

[image] Steffen: And yes Givo i meant three.js :slight_smile: I know what you mean when you say [image] Steffen: three.js community just dont gives a f*ck.js I would say there really isn’t a big community around three.js. just stackoverflow posts and this guy: https://www.youtube.com…

Hello and welcome to the family @Steffen ! You can definitely use DOM element on top of Babylon.js canvas. There is no problem at all ( @sharp describes it pretty well) CSS+HTML+BABYLON is definitely your way to go :smiley:

Hi there! Sorry for picking up an old Topic, but I seem to be stuck. While I get, that I can put HTML over the Canvas, I cant manage to overlay this with transparent Background. What i aim to achieve is Semi-Transparent Buttons and Text over the Babylon Canvas. Has anybody a simple example for me…

The Virtual Joysticks work like that but you have to be careful with the z-index because the upper canvas will catch all the events

the key is a little CSS to put any html element ontop of your canvas. use an higher zindex than your canvas and position:absolute; to place elements in corners another useful thing is PEP to catch inputs across all plattforms, special if you want to go mobile: https://github.com/jquery/PEP

I know this is a little bit old, but hopefully this might help someone else having the same question. While using the DOM is totally possible with BJS, BJS GUI is a real alternative. I have used it in all my projects and it is fairly easy to setup and behave as we want it to. The main issue I faced …

HTML/DOM GUI instead of BABYLON.GUI

Questions

Joseph_DeStefano June 11, 2019, 5:23pm 11

I use HTML in my UI and have not run into any issues - yet. If anything, I suspect using HTML for your UI will be faster for the canvas to render than using a 2d rendered UI framework inside the canvas.

Topic		Replies	Views
Why should I use babylon.js GUI Questions	1	712	December 7, 2019
Can we make Gui like this with BabylonJS Questions	6	1852	February 21, 2019
Is it possible to use html tags in the GUI Questions gui	5	2175	March 28, 2023
Opinions wanted: HTML vs BabylonJS UI or hybrid? Questions	1	432	January 22, 2023
BablyonJS - Building GUI on canvas similar to this? Questions	11	1999	March 29, 2019

HTML/DOM GUI instead of BABYLON.GUI

Related topics