Question

有关详细信息，请参阅this thread。

总结一下，鉴于以下情况：

gl = canvas.getContext('experimental-webgl');
gl.clearColor(0, 0, 0, 1);
gl.colorMask(1, 1, 1, 0);
gl.blendFunc(gl.SRC_ALPHA, gl.ONE_MINUS_SRC_ALPHA);
gl.enable(gl.BLEND);

...和标准的渲染循环：

function doRender() {
  gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);
  // render stuff, and request another frame
  requestAnimationFrame(doRender);
}

...然后我想知道理论上应该的预期输出是什么。

实际上，我看到第一帧渲染好像没有颜色遮罩，第二帧（和后续）渲染整个画布不透明白色

请注意，alpha级别设置为什么并不重要：第二帧始终是立即的，完全是白色的（包括未渲染的区域），即使渲染的alpha值非常低。

问题：对第一帧，第二帧和后续帧的上述操作的预期结果是什么？此外，我正在经历预期的结果，或由于GL驱动程序或WebGL实现中的一些错误？最后，如果是预期结果，为什么？视频卡上实际发生了什么以产生这种结果？

系统详情：MacBook Pro / GeForce 320M / Snow Leopard上的Chrome / Firefox（两者）。

Answer 1

WebGL会自动清除每个帧上的绘图缓冲区，除非您告诉它不要

尝试

gl = canvas.getContext('experimental-webgl', {
   preserveDrawingBuffer: true
});

这可能比让它清楚明白要慢，因为它可能必须每帧都制作一个绘图缓冲区的副本以保留它，所以它有一个副本与页面的其余部分合成，同时你将新的东西绘制到其中。因此，在渲染循环中调用gl.clear可能更好。当然如果你想要的效果是不断地将东西混合到绘图缓冲区中，那么你需要告诉它像上面的例子那样被保存，或者你需要使用帧缓冲区绘制到纹理或渲染缓冲区然后渲染到绘图缓冲区。

为什么当掩盖alpha时，WebGL画布在第二帧上变为白色？

1 个答案: