Html SVG（Raphaë；l）与WebGL（THREE.js）重叠

目前我正在使用THREE.js库渲染3D场景，没有问题

我想覆盖一个SVG，但我有以下问题，最好在图中演示：

如您所见，如果没有WebGL（顶部图像），我的2D元素将渲染。红色条来自Raphael（SVG），灰色的指杆使用纯画布2D上下文渲染

使用WebGL参考底图（底部图像），纯画布2D上下文继续正常渲染，但Raphael（SVG）呈现参考底图WebGL的外观。然而，3D视图表明图层和位置是正确的

---

这仅仅是两种不兼容的渲染方法的情况，还是我可能会在某个地方更改设置。我更愿意使用Raphael来实现它的.onTouch功能，但如果必须的话，我愿意使用纯画布2D上下文来实现覆盖。

看起来像是zIndex的问题。当您添加three.js DomeElement时，您要将其添加到什么

svg是否位于dom树的更高位置，并在末尾附加webgl

webgl是否绝对定位，而svg是否绝对定位？等