内部组件时反应三纤维着色器uv错误

我正在尝试修改react流渲染器中的一个示例( React Flow Audio )以渲染每个节点内部的着色器。为此,我有一个输出UV的测试着色器,但在节点内部时它看起来不太对劲,因为并非所有的颜色光谱都可见。但是,如果我在 index.js ,它确实按预期渲染。

下面是一个重现问题的沙盒: CodeSandbox .注释第11行或第12行 索引js 显示了情况。以下是一些快照:

我什么都试过了,但还是解决不了问题。我想使用画布进行光线行进,除了从画布中心平移之外,结果也得到了很好的渲染。

我还尝试过其他库来渲染着色器,比如 shadertoy-react 或 gl-react ,但我得到了错误:

Failed to execute 'shaderSource' on 'WebGLRenderingContext': parameter 1 is not of type 'WebGLShader'."

感谢您的帮助。