I am trying to integrate Dear ImGui to my next project. To be more specific, I am trying to integrate it’s Javascript binding, which generates the binding using Emscripten from the C sources and then converts all the functions to Typescript equivalents. Its a close match, only some parts are not converted, which still produce great results.
Basically, the library can be built from sources, which produces 2 files in order to run their examples: imgui.umd.js and imgui_impl.umd.js. The first one is the main lib, while the second one is a helper to set up the canvas, webgl context, inputs, etc. The imgui_impl is very useful for a general use cases, when you are working with the canvas directly, like if you use Three.js, for example.
However, it is not needed in my case, snce all the gl backend setup is handled by Playcanvas. In fact, the way imgui_impl is imeplemented, it draws itself in the canvas frame buffer before Playcanvas, and then leaves the context configured in a way that prevents PC to render its own stuff. Anyhow, as mentioned, it is not needed, since we can use imgui.umd directly and feed its data to the index and vertex buffers created in PC. However, I am not yet too familiar with pc.graphicsDevice to manage buffers.
Here is my attempt so far. I’ve made a small project, with a single cube. I am trying to draw a simple window, using imgui. The setup is correct, and I was able to initialize the window, but I am stuck at actually drawing it. The imgui feeds me with the draw data for each frame:
I expect now I would need to create Playcanvas index and vertex buffers and set them to the data, provided by
imgui. What would be the correct way of setting the buffers and rendering to UI layer?
