Three.js为不同的vertex / fragmentShaders创建不同的id？

Question

所以我注意到着色器必须在html文档中声明，而不是在外部js文件中声明。此外，不同着色器必须具有与之关联的不同ID。我的问题是，在创建多个着色器时，我必须创建多个脚本标记并给出每个不同的ID或完成所有操作 一个类型的着色器进入一个脚本标记？

<script id="vertexShader1" type="x-shader/x-vertex"> 
void main() {}
</script>

<script id="fragmentShader1" type="x-shader/x-vertex"> 
void main() {}
</script>


<script id="vertexShader2" type="x-shader/x-vertex"> 
void main() {}
</script>

<script id="fragmentShader2" type="x-shader/x-vertex"> 
void main() {}
</script>

Answer 1

WebGL并不关心着色器源代码的来源。绝对没有什么可以阻止你通过AJAX加载它们，通过WebSockets流入它们，或者以某种方式将它们隐藏在超级特殊的PNG图像中。

将着色器存储在HTML源代码中通常很方便，以便在页面加载时轻松引用这些着色器。

原始底层WebGL方法只是将字符串作为着色器的源代码，因此没有任何强制您专门使用脚本标记的东西。