用途:把 DOM 元素变成 PixiJS v8 的纹理源,用于 Sprite、Texture 帧或 Mesh。提供两种源:HTMLSource 镜像实时元素像素(元素仍可编辑、可点击);ElementImageSource 包装不可变快照,不再重绘。二者位于 pixi.js/html-source,导入该路径会注册扩展。
主要能力:继承 TextureSource,支持 resolution、scaleMode、addressMode、label 等选项。HTMLSource 选项含 resource(必填,须为所属 canvas 的直接子元素)、canvas、autoLayout(默认 true)、autoUpdate(默认 true)、autoRequestPaint(默认 true);ElementImageSource 选项含 resource(必填,来自 canvas.captureElementImage)与 autoClose(默认 false)。可通过 HTMLSource.defaultOptions 改默认值。
用法:从 pixi.js/html-source 导入类;元素须 app.canvas.appendChild 为直接子元素;用 Sprite.from(source) 显示。逐帧变化内容设 autoRequestPaint:false 并在 ticker 中调用 source.requestPaint()。快照用 canvas.captureElementImage 获取,共享快照时勿设 autoClose。销毁用 source.destroy()。
限制:依赖实验性 HTML-in-Canvas 提案,需浏览器开启,否则首次上传抛错;可用 canvas.requestPaint 特性检测。API 可能在小版本间变化。Web Worker 无 DOM,不可用。Image、video、canvas 元素被自动检测拒绝,需显式构造。元素非 canvas 直接子元素会抛错。
适用场景:在 GPU 管线内渲染可交互表单、时钟等实时 DOM,或做冻结快照的过渡、碎裂、拖尾效果。相关技能:pixijs-scene-sprite、pixijs-scene-mesh、pixijs-scene-dom-container、pixijs-assets、pixijs-environments。