pixijs-scene-dom-container

To overlay HTML elements on a PixiJS canvas, use a DOMContainer to position native elements like inputs or iframes over the scene and drive their CSS transforms from the scene graph, keeping them synchronized with display objects.

Yes, you can sync HTML DOM overlays with PixiJS scene graph transforms by using DOMPipe to render and align DOM content, ensuring elements like videos and rich UI track display objects accurately.

The best way to align native inputs and iframes over a PixiJS scene is configuring DOMContainerOptions like element and anchor, which aligns the HTML overlay content with the canvas objects.

Yes, you need the pixi.js DOM extension and DOMPipe to render and align HTML overlays, as they provide the necessary mechanism to position DOM content over the canvas.

CSS transforms allow native HTML elements like iframes and videos to retain their native functionality while following PixiJS display objects, solving the problem of embedding rich UI that canvas rendering cannot natively handle.

You can track native inputs, iframes, videos, and other rich HTML UI elements by overlaying them on a PixiJS canvas and synchronizing their positions with display object transforms.