Question

我目前正在研究一种GLSL着色器，它使用大量纹理文件将多个材质叠加在一起，这些材质会被每个图层的alpha混合图像单独遮盖。该效果应该模仿具有背衬，中间网格和顶部第三网格的织物。在处理这个问题时，我很快就在着色器中对纹理单元进行了限制。作为一种解决方案，我将开始将纹理组合到RGB通道中，以便为着色器提供更多纹理，并考虑将多个漫反射图像或其他图像组合成单个图像。但与此同时，我的问题是：

WebGL 2.0会提供更多的纹理单元，还是受到显卡本身的限制？就像一般知识问题一样，Max Combined Texture Unit数是我在WebGL上下文中可以拥有的纹理单元总数吗？这与Max Texture Units有何不同？我只是想了解这里的局限性。以下是我的Macbook Pro上的Browserleaks for WebGL的结果。

Answer 1

WebGL 2.0是否会提供更多纹理单元，还是受到显卡本身限制？

这是硬件限制。

是最大组合纹理单位数，是我在WebGL上下文中可以拥有的纹理单元总数吗？

是

与Max Texture Units有何不同？

GL_MAX_TEXTURE_IMAGE_UNITS仅将应用于片段着色器访问的纹理。 GL_MAX_COMBINED_TEXTURE_IMAGE_UNITS指定所有着色器阶段可以访问的纹理总数。

WebGL 1.0不允许非FS阶段访问纹理。 WebGL 2.0允许多个阶段访问纹理。

Answer 2

MAX_COMBINED_TEXTURE_IMAGE_UNITS是存在的纹理单元总数。

MAX_TEXTURE_IMAGE_UNITS是您可以在片段着色器中使用的纹理单元总数

MAX_VERTEX_TEXTURE_IMAGE_UNITS是您可以在顶点着色器中使用的纹理单元总数

您通过调用gl.getParameter

查询这些值

function main(webglVersion) {
  const gl = document.createElement('canvas').getContext(webglVersion);
  if (!gl) {
    return console.log('no', webglVersion);
  }
  console.log(webglVersion);
  console.log(
    'MAX_COMBINED_TEXTURE_IMAGE_UNITS',
    gl.getParameter(gl.MAX_COMBINED_TEXTURE_IMAGE_UNITS));
  console.log(
    'MAX_TEXTURE_IMAGE_UNITS',
    gl.getParameter(gl.MAX_TEXTURE_IMAGE_UNITS));
  console.log(
    'MAX_VERTEX_TEXTURE_IMAGE_UNITS',
    gl.getParameter(gl.MAX_VERTEX_TEXTURE_IMAGE_UNITS));
}
main('webgl');
main('webgl2');

假设您获得了这些结果

MAX_COMBINED_TEXTURE_IMAGE_UNITS 20
MAX_TEXTURE_IMAGE_UNITS 8
MAX_VERTEX_TEXTURE_IMAGE_UNITS 16

这意味着您在顶点着色器中最多可以使用8个，在片段着色器中最多可以使用16个，但是总共不能超过20个。

WebGL 2.0是否会提供更多的纹理单位，或者这是否受图形卡本身的限制？

WebGL 2.0的最低要求高于WebGL1的最低要求。通常，在同一个GPU上，它们最有可能提供相同的数量，但是有些支持WebGL1的GPU不支持WebGL2

WebGL与WebGL2的最低保证值

                                   WebGL1  WebGL2
MAX_COMBINED_TEXTURE_IMAGE_UNITS     8       32
MAX_TEXTURE_IMAGE_UNITS              8       16
MAX_VERTEX_TEXTURE_IMAGE_UNITS       0       16

请注意，MAX_VERTEX_TEXTURE_IMAGE_UNITS的WebGL1中的最小值为0。这意味着在顶点着色器中使用纹理是WebGL1上的可选功能。幸运的是most devices support at least 4

WebGL 2.0最大图像纹理单元和最大组合纹理单元之间有什么区别？

2 个答案: