在同一画布中绘制2个场景 - three.js

Question

我希望有2个场景,每个场景都添加了一个相机,我希望它们可以在同一个画布上绘制(但不要划分这个画布).我使用了2个渲染器,它们在同一个画布元素中绘制,但我的问题是第二个渲染器会覆盖第一个,所以我只能看到2个场景中的一个.我尝试 alpha: true了渲染器,setClearColor( 0x000000, 0 );但仍然没有想要的结果.

我希望实现画中画效果,但我希望"内部画面"是透明的(仅绘制对象,而不是背景).

这可能是three.js吗？

谢谢

Answer 1

如果您有两个场景,并且想要创建画中画效果,则可以使用以下模式.第一套autoClear:

renderer.autoClear = false; // important!

然后在渲染循环中,使用如下的模式:

renderer.clear();
renderer.setViewport( 0, 0, window.innerWidth, window.innerHeight );
renderer.render( scene, camera );

renderer.clearDepth(); // important! clear the depth buffer
renderer.setViewport( 10, window.innerHeight - insetHeight - 10, insetWidth, insetHeight );
renderer.render( scene2, camera );

three.js r.71