如果我没记错的话,您必须对第一个缓冲区使用颜色附件 0,对第二个缓冲区使用颜色附件 1,对第三个缓冲区使用颜色附件 2 等等。
换句话说,这是可以的
gl.drawBuffers([
gl.COLOR_ATTACHMENT0, // color attachment 0 to draw buffer 0
gl.COLOR_ATTACHMENT1, // color attachment 1 to draw buffer 1
gl.COLOR_ATTACHMENT2, // color attachment 2 to draw buffer 2
]);
这也可以
gl.drawBuffers([
gl.COLOR_ATTACHMENT0, // color attachment 0 to draw buffer 0
gl.NONE, // NONE to draw buffer 1
gl.COLOR_ATTACHMENT2, // color attachment 2 to draw buffer 2
]);
这不是!!
gl.drawBuffers([
gl.COLOR_ATTACHMENT0, // color attachment 0 to draw buffer 0
gl.COLOR_ATTACHMENT2, // color attachment 2 to draw buffer 1 ERROR!
gl.COLOR_ATTACHMENT1, // color attachment 1 to draw buffer 2 ERROR!
]);
所以就你的情况而言。
gl.drawBuffers([
gl.COLOR_ATTACHMENT3, // color attachment 3 to draw buffer 0 ERROR!
]);
必须始终匹配 0 到 0、1 到 1、2 到 2 等。
如果这确实是你正在做的事情,你应该创建 3 个帧缓冲区对象。一个包含前 3 个缓冲区,一个包含第四个缓冲区,一个包含所有 4 个缓冲区。然后你会做类似的事情
gl.bindFramebuffer(gl.FRAMEBUFFER, threeAttachmentFB);
gl.drawBuffers([gl.COLOR_ATTACHMENT0, gl.COLOR_ATTACHMENT1, gl.COLOR_ATTACHMENT2]);
.. draw stuff ..
gl.bindFramebuffer(gl.FRAMEBUFFER, oneAttachmentFB);
gl.drawBuffers([gl.COLOR_ATTACHMENT0]);
.. draw stuff ..
gl.bindFramebuffer(gl.FRAMEBUFFER, fourAttachmentFB);
gl.drawBuffers([gl.COLOR_ATTACHMENT0, gl.COLOR_ATTACHMENT1,
gl.COLOR_ATTACHMENT2, gl.COLOR_ATTACHMENT3]);
.. draw stuff ..
除此之外,不保证各种组合都能发挥作用。目前尚不清楚 WebGL2 中的限制是什么,但在 WebGL1 中只有这些组合才能保证工作
-
一种颜色附件(有或没有深度或深度模板)
COLOR_ATTACHMENT0_WEBGL = RGBA/UNSIGNED_BYTE
-
两种颜色附件(有或没有深度或深度模板)
COLOR_ATTACHMENT0_WEBGL = RGBA/UNSIGNED_BYTE
COLOR_ATTACHMENT1_WEBGL = RGBA/UNSIGNED_BYTE
-
三种颜色附件(有或没有深度或深度模板)
COLOR_ATTACHMENT0_WEBGL = RGBA/UNSIGNED_BYTE
COLOR_ATTACHMENT1_WEBGL = RGBA/UNSIGNED_BYTE
COLOR_ATTACHMENT2_WEBGL = RGBA/UNSIGNED_BYTE
-
四种颜色附件(有或没有深度或深度模板)
COLOR_ATTACHMENT0_WEBGL = RGBA/UNSIGNED_BYTE
COLOR_ATTACHMENT1_WEBGL = RGBA/UNSIGNED_BYTE
COLOR_ATTACHMENT2_WEBGL = RGBA/UNSIGNED_BYTE
COLOR_ATTACHMENT3_WEBGL = RGBA/UNSIGNED_BYTE
所有其他组合可能会或可能不会工作,具体取决于 GPU/驱动程序/浏览器/操作系统