Three.js 纹理均匀和gl_FragData的着色器错误

我将我的three.js更新到118，但与着色器相关的旧代码部分出现错误：我得到两种类型的错误：一种是当统一变量命名为texture时：需要将其命名为与texture不同的任何内容。第二个是：gl_FragData现在是未声明的标识符（我在着色器中使用它来读取地形高度）。所有这些都在早些时候起作用。有人知道发生了什么吗？

因为

r118

，

WebGLRenderer

默认使用webgl2。这意味着基于

ShaderMaterial

的自定义着色器代码将自动解释为GLSL 3.0代码。不幸的是，此更改可能会破坏用户代码，并且需要迁移任务

如果您没有时间预算，我建议您使用随

r118

引入的。此呈现程序与

WebGLRenderer

相同，它只强制WebGL 1上下文，因此您的代码应该像以前一样运行

但是，如果要升级到WebGL 2，则必须升级着色器代码以使其符合GLSL 3.0。这意味着：

• 由于

  texture

  是一个保留字，因此必须将其重命名为其他名称
• 默认情况下，GLSL 3.0中不存在GLU FragData。您必须手动定义输出颜色。简单的片段着色器如下所示：

---

编译器已更改，不太兼容。当您从一个编译器移动到另一个编译器时，这种问题很常见；用gl_FragColor wroks替换gf_FragData[0]，但没有解释gl_FragData的问题您可能升级了您的glsl语言，您使用的是什么版本？这很有趣：不，我的版本不是最近的版本：4.2无论如何，如果您使用的GLSL语言版本（不同于OpenGL 3.2版本之前的OpenGL版本，在3.2版本之后，他们将其规范化以避免混淆）大于1.30，那么您应该使用声明方式，而不是通过内置变量。通过此链接，您可以获得更改代码所需的所有信息。好的，谢谢。我会更新，但有一个问题：FragColor仍然存在，但会影响“所有渲染缓冲区”，因为FragData只有一个（如果我是对的）；手动操作“out vec4 OUTCLOR”对处理单个缓冲区是否具有类似的效果？TBH，我不确定你的意思，但我上面共享的代码是前一个

gl\u FragData

^^^的1:1替代。如果答案对你有用，请接受/投票。

#version 300 es
precision highp float;
 
out vec4 outColor;
 
void main() {
   outColor = vec4(1.0);
}