Three.js:着色器无法使用 gl.MAX_TEXTURE_IMAGE_UNITS 纹理进行编译

Three.js: Shader won't compile with gl.MAX_TEXTURE_IMAGE_UNITS textures

我正在使用 Three.js 构建一个场景,我想在其中将最大数量的四边形打包到每个绘制调用中。在我的机器上,限制因素是我可以在每次绘制调用中显示的纹理数量。

让我感到困惑的是 gl.getParameter(gl.MAX_TEXTURE_IMAGE_UNITS) returns 16,但是如果我尝试将恰好 16 个纹理传递到我的 THREE.RawShaderMaterial,我会收到以下错误:

THREE.WebGLProgram: shader error: 0 gl.VALIDATE_STATUS false gl.getProgramInfoLog ERROR: Implementation limit of 16 active fragment shader samplers (e.g., maximum number of supported image units) exceeded, fragment shader uses 17 samplers

如果我恰好传入 15 个纹理,场景渲染良好(当然缺少纹理)。

我的问题是:Three.js 是否会在某处为每个绘制调用添加额外的纹理?如果不是,有谁知道是什么原因造成的?其他人可以就此问题提供的任何帮助将不胜感激。

My question is: Does Three.js add an additional texture to each draw call somewhere? If not, does anyone know what might account for this off by one problem?

是的,大部分素材都注入了与各种地图相关的各种采样器。它可以像 "albedo map" 一样简单,但也可以是阴影贴图等。如果你不想让三个注入东西,请使用 RawShaderMaterial

嗯,这很尴尬。事实证明我正在将 16 个纹理传递给着色器,但我试图访问 texture2D(textures[16]) 并且正是这种从采样器索引 > 最大纹理中读取的尝试引发了这个错误。

有趣的是,传递一个长于 gl.MAX_TEXTURE_IMAGE_UNITS 的 material 数组不会引发错误——它试图访问索引值 > gl.MAX_TEXTURE_IMAGE_UNITS-1 而引发错误。