为什么我不能在 webgl 中渲染为浮点纹理？

Question

我正在创建帧缓冲区并为其附加纹理。这是我想附加的纹理（但不起作用）：

gl.texImage2D(gl.TEXTURE_2D, 0, gl.R32F, sphere_texture.width, sphere_texture.height, 0, gl.RED, gl.FLOAT, null);

然而，当我使用它作为纹理格式时，它起作用了：

gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGB, sphere_texture.width, sphere_texture.height, 0, gl.RGB, gl.UNSIGNED_BYTE, null)

有谁知道如何渲染到帧缓冲区浮动纹理？

这就是我创建帧缓冲区的方式：

framebuffer = gl.createFramebuffer();
    gl.bindFramebuffer(gl.FRAMEBUFFER, framebuffer);
    gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT0, gl.TEXTURE_2D, scale_factor_texture, 0);
    gl.bindFramebuffer(gl.FRAMEBUFFER,  null);

Answer 1

对于 WebGL2 上下文（我假设您正在使用，按照您对 R32F 格式的预期用途），您需要启用 EXT_color_buffer_float 扩展以使这些格式可呈现：

if (!ctx.getExtension('EXT_color_buffer_float'))
    throw new Error('Rendering to floating point textures is not supported on this platform');

对于 WebGL1 上下文，有 WEBGL_color_buffer_float，以及启用 OES_texture_float 时的隐式支持（可以通过将这样的纹理附加到渲染目标并检查其完整性来探测），但是（与WebGL 1) 不支持渲染到单通道纹理。

为什么我不能在 webgl 中渲染为浮点纹理？

Why can't I render to a floating point texture in webgl?

webgl