Three.js 中的 Webgl 着色器编程
Webgl Shader Programming in Three.js
我正在尝试为 three.js 项目编写自定义顶点和片段着色器程序。我只需要一个特定的功能（自定义裁剪平面），所以我想简单地修改已经为我生成的着色器 three.js。问题是这样的着色器程序真的很长（片段着色器超过 700 行代码）。我需要以某种方式存储着色器并在声明新的 ShaderMaterial 时访问它们。
在哪里可以编写着色器以及如何访问它们？短着色器程序最简单的选择是使用 html 元素并通过 .textcontent 访问它，但正如我所说的那样，程序非常庞大，所以我的 html 文件很长。我试过使用 javascript 的 fileReader，但没有找到使用作为网站包一部分的本地文件的示例 - files/filetypes fileReader 使用的是用户输入的。
我想为我的着色器程序使用 .txt 文件，但我不知道如何访问它们。请发送帮助。
由于 WebGL 代码 运行 在客户端，在能够 运行 代码之前，您需要
(1) 通过某种协议从服务器请求着色器文件
(2) 使用 DOM APIs.
将其注入 DOM
根据您使用的是 jquery 还是其他 API，有多种选择。
对于其他 APIs，请参考线程，例如，
Javascript and WebGL, external scripts
我正在尝试为 three.js 项目编写自定义顶点和片段着色器程序。我只需要一个特定的功能（自定义裁剪平面），所以我想简单地修改已经为我生成的着色器 three.js。问题是这样的着色器程序真的很长（片段着色器超过 700 行代码）。我需要以某种方式存储着色器并在声明新的 ShaderMaterial 时访问它们。
在哪里可以编写着色器以及如何访问它们？短着色器程序最简单的选择是使用 html 元素并通过 .textcontent 访问它，但正如我所说的那样，程序非常庞大，所以我的 html 文件很长。我试过使用 javascript 的 fileReader，但没有找到使用作为网站包一部分的本地文件的示例 - files/filetypes fileReader 使用的是用户输入的。
我想为我的着色器程序使用 .txt 文件，但我不知道如何访问它们。请发送帮助。
由于 WebGL 代码 运行 在客户端，在能够 运行 代码之前，您需要
(1) 通过某种协议从服务器请求着色器文件
(2) 使用 DOM APIs.
将其注入 DOM根据您使用的是 jquery 还是其他 API，有多种选择。
对于其他 APIs，请参考线程，例如，
Javascript and WebGL, external scripts