Question

我的代码是这样的：

function render() {
    renderer.render( scene, camera );
    renderer.clear();
}

我想知道为什么它让我的场景变黑。那是因为颜色缓冲区在实际渲染之前被清除了吗？

通过这种方式，它运作良好：

function render() {
    renderer.clear();
    renderer.render( scene, camera );
}

但是，在调用clear()之前，如何确保颜色缓冲区已呈现？

我很好奇结束时和结束时之间的差异。

Answer 1

在渲染之前和之后清除渲染器的帧缓冲区之间的区别在于WebGL内容呈现给网页的方式。事实上，WebGL总是至少是双缓冲的（在WebGL Insights中，来自Mozilla的人说，在Firefox WebGL中，实际上是三重缓冲的）。这意味着在requestAnimationFrame回调（在您的情况下为render函数）中，所有WebGL调用仅影响所谓的后台缓冲区。另一个缓冲区（称为前缓冲区）不受影响。然后，当回调结束时，浏览器交换缓冲区：后台缓冲区变为前缓冲区，前台缓冲区变为后台缓冲区。然后，浏览器使用新的前缓冲区来绘制网页。 WebGL将在下次调用rAF回调时吸引新的后台缓冲区。重要的是要注意默认情况下浏览器在交换时不会更改缓冲区的内容（preserveDrawingBuffer上下文选项会更改）。

回到你的问题，区别在于当你第一次渲染场景然后清除缓冲区时，你首先会得到奇怪的结果，因为帧缓冲包含相同的先前渲染帧的渲染结果（你不会看到那些结果在屏幕上，它们只是在缓冲区的内存中），然后你会清除缓冲区，使所有这些无关紧要。之后，浏览器将按原样向页面呈现干净的缓冲区，或者呈现为黑色矩形（或根据渲染器的选项使用某种不同的颜色）。但是，如果先清除然后渲染场景，您将得到正确的结果：首先清除消除前一帧的残留，然后将新内容放入其中。然后浏览器将其显示在页面上。

所以，总结一下：我们通常首先清除帧缓冲区以删除任何先前帧的痕迹，因此我们从“清理平板”开始，然后向其渲染内容。

将renderer.clear（）放在render（）的末尾会使我的场景变黑

1 个答案: