有没有办法在webgl2中的帧缓冲区之间交换数据? (尝试多阶段图像处理)

时间:2019-01-28 12:04:48

标签: javascript glsl framebuffer webgl2

我正在尝试将用于图像处理的原始javascript代码转换为webgl2中的GLSL,以实现性能提升。 简单解释一下,这是我的方法:

每帧: 1)将相机流视频设置为纹理 2)在第一帧缓冲区中应用一些效果 3)将结果设置为第二帧缓冲区的纹理 3)在第二帧缓冲区中应用一些效果 4)将结果设置为第三帧缓冲区的纹理 5)在第三帧缓冲区中应用一些效果 ... 最后一步)设置空帧缓冲区,并绘制到具有最终效果的画布上。

注意:效果是渐进的,并基于先前效果的完成结果

我的问题是,我希望片段着色器写入除标准fragmentOutput之外的数据/元数据数组,以便在下一帧缓冲区中用于某些操作。

所以从技术上讲,我希望我的第一个着色器通道保存并排列,第二个着色器通道使用这些保存的值。我正在寻找用于此的结构/数据/对象,如果可能的话,如何使用它

代码如下所示:

//-- Load video frame and snapshot
refresh_texture();

//-- use first buffer to draw
GL.bindFramebuffer(GL.FRAMEBUFFER, framebuffers[0]);
GL.uniform1f(_stageNumber, 0);
GL.drawElements(GL.TRIANGLES, 6, GL.UNSIGNED_SHORT, 0);
////////////////////////////////////////////////////////////////////////////////

// for the next draw, use the texture we just rendered to.
GL.bindTexture(GL.TEXTURE_2D, textures[0]);
GL.uniform1f(_stageNumber, 1);
//-- use second buffer to draw
GL.bindFramebuffer(GL.FRAMEBUFFER, framebuffers[1]);
GL.drawElements(GL.TRIANGLES, 6, GL.UNSIGNED_SHORT, 0);

0 个答案:

没有答案