javascript - 使用 jquery 访问 three.js 的着色器文件内容

Question

我需要访问我从另一个脚本中使用 HTML 导入的字符串的文本。

我在 html 文件中包含有问题的文本文件:

<script src="shaders/fragmentshader.fs" id=fragmentshader></script>

然后我想把这个文件的内容放在另一个脚本文件中的一个变量中，并将它用作 three,js 的着色器:

var fShader = $('#fragmentshader');

var shader = new THREE.ShaderMaterial({
    vertexShader: vShader.text(),
    fragmentShader: fShader.text()
});

如果我只是在 html 文件的脚本标签之间编写必要的着色器代码，这段代码就可以正常工作，但如果像上面那样使用，则只能访问严格的 url(而不是数据)。

我的问题是如何在如上所示加载文件后访问文件中的文本？

Answer 1

您不能在script 标签中使用src 加载着色器。

您可以使用 ShaderLoader.js然后写:

<script data-src="shaders/name/vertex.js" data-name="shader" 
type="x-shader/x-vertex"></script>

在 js 中:

SHADER_LOADER.load(function(data) {
    var particlesVertexShader = data.shader.vertex;
});