镜子反射怪癖三JS

时间:2015-03-21 22:34:00

标签: reflection 3d three.js shader mirror

(免责声明:关于SO的第一篇文章。我已经搜索了SO和其他地方的答案,但是当镜像和反思确实出现时,我还没有找到与我的特定问题相关的任何内容。)

Problematic Mirror

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

相关代码:

  // 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 );
}

我已经尝试弄乱纹理设置和剪贴板无济于事,整个代码主要基于The ThreeJS reference example for Mirror

非常感谢任何和所有帮助 - 谢谢!

1 个答案:

答案 0 :(得分:2)

感谢WestLangleyverticalMirror.render()节省了一天!镜子现在很漂亮。我会避免renderWithMirror,直到我更好地了解它的作用。

非常感谢。