在WebGLrenderer中使用autoclear和preserveDrawingBuffer

Question

我有一个Three.js场景,我在其中设置了渲染器的preserveDrawingBuffer:true因为我想使用renderer.toDataURL拍摄画布上的内容的快照,我也使用renderer.autoClear = false因为我使用的是2个场景每个一个摄像头(当然一个渲染器).

问题在于,当我使用orbitControls移动相机时,对象不会像它们应该的那样动画,它们之前的状态保留在画布上,并且由于preserveDrawingBuffer:true设置,它们正在创建一个丑陋的绘画(它们不会被删除).

如何同时拥有2个场景/摄像机和轨道控制的快照功能,我该怎么办？

谢谢.

Answer 1

如果您正在实例化WebGLRenderer并保留绘图缓冲区,如下所示:

var renderer = new THREE.WebGLRenderer( { preserveDrawingBuffer: true } );

如果你正在设置

renderer.autoClear = false;

你需要renderer.clear()在渲染之前调用它:

renderer.clear();
renderer.render( scene, camera );

three.js r.69