Question

我需要能够强制在场景的其余部分上绘制1或2个元素，而不管它们与相机的实际距离。

使用CSS3DRenderer时有没有办法控制渲染顺序？

我尝试在创建CSS3DObject的dom元素上使用zIndex和z-index，但没有效果。

object.renderDepth似乎没有效果。

我没有使用重叠的场景，因为这非常复杂，我认为由于CSS3DRenderer的工作原理并且在dom内部清除，因此无法工作......

如果这提供了一个简单的解决方案或（不太可能）使事情复杂化，我也在使用jquery。

Answer 1

使用CSS3DRenderer时，您可以通过将元素添加到第二个场景并渲染到第二个画布来强制元素在顶部渲染。

renderer = new THREE.CSS3DRenderer();
renderer.setSize( window.innerWidth, window.innerHeight );
document.body.appendChild( renderer.domElement );

renderer2 = new THREE.CSS3DRenderer();
renderer2.setSize( window.innerWidth, window.innerHeight );
renderer2.domElement.style.position = 'absolute';
renderer2.domElement.style.top = 0;
document.body.appendChild( renderer2.domElement );

scene.add( object );
scene2.add( object2 );

然后，在动画循环中：

renderer.render( scene, camera );
renderer2.render( scene2, camera );

Three.js CSS3DRenderer可以控制渲染顺序吗？

1 个答案: