ThreeJS 中的镜面反射怪癖

Mirror reflection quirks in ThreeJS

(免责声明:首先 post 关于 SO。我已经在 SO 和其他地方搜索过这个问题的答案,但是虽然确实出现了镜像和反射,但我没有找到与我的特定问题相关的任何内容.)

Problematic Mirror

这是我在 ThreeJS 中的第一个场景,大部分都是基于官方示例(超级有用!)。如您所见,无论出于何种原因,从大多数角度来看,镜面反射都是black/fragmented,因此它仅在非常窄的范围内显示出适当的反射。 (探索其他角度以了解我在说什么。)

相关代码:

  // MIRROR

verticalMirror = new THREE.Mirror( renderer, camera, { clipBias: 0.003, textureWidth: 1024, textureHeight: 1024, color:0x889999 } );

var verticalMirrorMesh = new THREE.Mesh( new THREE.PlaneBufferGeometry( 300, 300 ), verticalMirror.material );
verticalMirrorMesh.add( verticalMirror );
verticalMirrorMesh.position.y = 100;
verticalMirrorMesh.position.z = -500;
scene.add( verticalMirrorMesh );

在渲染函数中:

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

我试过搞乱纹理设置和 clipbias 无济于事,整个代码主要基于 The ThreeJS reference example for Mirror

非常感谢任何帮助 - 谢谢!

感谢 WestLangleyverticalMirror.render() 挽救了一切!镜子现在反射得很漂亮。在我更好地了解它的作用之前,我会避免使用 renderWithMirror

非常感谢。