webgl - WebGL2 渲染到 R32F 纹理

Question

我无法将R32F纹理绑定到，因为根据此来源framebuffer，此类纹理不是“默认情况下可渲染颜色” 。

但随后它说“这些功能可作为可选扩展使用”。

如何使用这些扩展？我如何让它工作？

标签： webglwebgl2webgl-extensions

Answer 1

您尝试启用EXT_color_buffer_float扩展

function main() {
  const gl = document.createElement("canvas").getContext("webgl2");
  const ext = gl.getExtension("EXT_color_buffer_float");
  if (!ext) {
    console.log("sorry, can't render to floating point textures");
    return;
  }

  const tex = gl.createTexture();
  gl.bindTexture(gl.TEXTURE_2D, tex);
  const level = 0;
  const internalFormat = gl.R32F;
  const width = 1;
  const height = 1;
  const border = 0;
  const format = gl.RED;
  const type = gl.FLOAT;
  gl.texImage2D(
    gl.TEXTURE_2D, level, internalFormat,
    width, height, border, format, type, null);

  const fb = gl.createFramebuffer();
  gl.bindFramebuffer(gl.FRAMEBUFFER, fb);
  gl.framebufferTexture2D(
    gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT0,
    gl.TEXTURE_2D, tex, level);

  const status = gl.checkFramebufferStatus(gl.FRAMEBUFFER);
  console.log(`can ${status === gl.FRAMEBUFFER_COMPLETE ? "" : "NOT "}render to R32`);
}
main();