1

我正在通过 HDR 实现 Bloom 后期处理效果。我正在使用一个脚手架,它是一个在线教程来实现相同的效果,但基于(教程)最新版本的 OpenGL。我正在使用带有 OpenGL ES 2.0 的 WebGL 1.0 来编写着色器脚本。一个例子是这个 renderBuffer 生成脚本(注意第 4 行):

rboDepth = gl.createRenderbuffer()
        gl.bindRenderbuffer(gl.RENDERBUFFER, rboDepth);
        gl.renderbufferStorage(gl.RENDERBUFFER, gl.DEPTH_COMPONENT, gl.viewportWidth, gl.viewportHeight);
        glFramebufferRenderbuffer(gl.FRAMEBUFFER, gl.DEPTH_ATTACHMENT, gl.RENDERBUFFER, rboDepth);
        // - Tell OpenGL which color attachments we'll use (of this framebuffer) for rendering 
        var attachments = [ gl.COLOR_ATTACHMENT0, gl.COLOR_ATTACHMENT1 ];
        glDrawBuffers(2, attachments);
        // - Finally check if framebuffer is complete
        if (gl.checkFramebufferStatus(gl.FRAMEBUFFER) != gl.FRAMEBUFFER_COMPLETE)
            alert("Framebuffer not complete!" );
4

1 回答 1

0

drawBuffers 可作为 WebGL 中的扩展,WEBGL_draw_buffers. 要使用它,请检查扩展名

var ext = gl.getExtension("WEBGL_draw_buffers");
if (!ext) {
  alert("no WEBGL_draw_buffers: sucks to be you");
  ...
} 

如果您希望上面的代码按原样运行,您可以像这样将其复制到 WebGL 上下文中。

for (var key in ext) {
  var value = ext[key];
  if (typeof value === 'function') {
    value = value.bind(ext);
  }
  // remove WEBGL suffix
  var newKey = key.replace(/_?WEBGL/, '');
  gl[newKey] = value;
}

不幸的是,至少根据webglstats.com WEBGL_draw_buffers的数据,只有大约 60% 的设备支持。我对这个数字如此之低感到有点震惊,但是我知道很多驱动程序都有/有与设置 drawBuffers 相关的严重错误。它们在以常用方式设置时可以工作,但在以不太常用的方式设置时会使驱动程序崩溃。由于这对于浏览器来说是不可接受的,因此该功能在任何存在已知错误的设备上都被列入黑名单。我知道在带有 NVidia 芯片的 OSX 上确实有一段时间,但我知道它已修复,因为我在带有 NVidia 的 OSX 设备上键入此内容,并且 WebGL 中提供了绘图缓冲区

无论如何,这就是你获得drawBuffers的方式。如果扩展不可用,那么你有点不走运。WEBGL_draw_buffers不可用时的解决方案。

  1. 多次渲染,每个绘制缓冲区一次

    是的,真的很慢

  2. 回退到其他一些不需要绘图缓冲区的低质量渲染

  3. 告诉用户他们运气不好。

于 2016-05-06T11:54:18.197 回答