1

我正在尝试在 WebGL2 中使用浮点纹理。我像这样初始化纹理：

function textureFromFloat32Array( gl, arr, w, h ){
    //https://developer.mozilla.org/en-US/docs/Web/API/OES_texture_float_linear
    gl.getExtension('OES_texture_float');        // just in case
    gl.getExtension('OES_texture_float_linear'); // do I need this with WebGL2
    const texture = gl.createTexture();
    gl.bindTexture( gl.TEXTURE_2D, texture);
    // see https://www.khronos.org/registry/webgl/specs/latest/2.0/#TEXTURE_TYPES_FORMATS_FROM_DOM_ELEMENTS_TABLE
    gl.texImage2D(gl.TEXTURE_2D, 0, gl.R32F, w, h, 0, gl.RED, gl.FLOAT, arr);
    gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
    gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
    gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR);
    gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR);
    //gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.NEAREST); // this works
    //gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.NEAREST);
    return texture;
}

在 Firefox 55.0.2（64 位）中，它给了我以下错误：

Error: WebGL warning: drawElements: Active texture 0 for target 0x0de1 is 'incomplete', and will be rendered as RGBA(0,0,0,1), as per the GLES 2.0.24 $3.8.2: Because minification or magnification filtering is not NEAREST or NEAREST_MIPMAP_NEAREST, and the texture's format must be "texture-filterable".

有了gl.NEAREST它，但我需要线性插值。

在 Chorme 60.0.3112.101 中它可以使用， gl.getExtension('OES_texture_float_linear');但我想在使用时WebGL2我不需要它。

4

1 回答 1

3

甚至 WebGL2 也需要OES_texture_float_linear.

WebGL2 默认支持浮点纹理，但默认不支持对它们进行过滤或渲染。这两个都是扩展。请参阅此页面上的表格，了解支持的纹理格式以及您是否可以过滤或渲染它们。

大多数手机不支持过滤浮点纹理，也不支持渲染到浮点纹理。至少截至 2017 年 9 月。

为了能够过滤浮点纹理，您需要检查并启用OES_texture_float_linear. 为了能够渲染到浮点纹理，您需要检查并启用EXT_color_buffer_float

于 2017-09-18T01:12:37.623 回答