Three.js: WebGL镜像示例工件

创建于 2017-08-17  ·  5评论  ·  资料来源: mrdoob/three.js

可以通过放大并稍微移动相机来复制伪像。

https://threejs.org/examples/webgl_mirror.html

screen shot 2017-08-16 at 8 53 26 pm

Three.js版本
  • [x]开发
  • [x] r86
浏览器
  • [x]铬
操作系统
  • [x] macOS

最有用的评论

@mrdoob如果您仍然在搞乱,我认为还有简化的余地...

//mirrorCamera.up.set( 0, - 1, 0 );
//mirrorCamera.up.applyMatrix4( rotationMatrix );
//mirrorCamera.up.reflect( normal ).negate();

mirrorCamera.up.set( 0, 1, 0 ).applyMatrix4( rotationMatrix ).reflect( normal );

所有5条评论

确实。
另请参阅以下主题: https :
最后,我感到镜像未正确实现。

主相机的纵横比永远不会复制到镜像相机。

// "examples/Mirror.js" (lines 142-146)
mirrorCamera.near = camera.near;
mirrorCamera.far = camera.far;
mirrorCamera.updateMatrixWorld();
mirrorCamera.updateProjectionMatrix();

应更改为:

mirrorCamera.updateMatrixWorld();
mirrorCamera.projectionMatrix.copy(camera.projectionMatrix);

稍后,我将为此发送公关!

镜子(和平面海洋)的另一个问题是,启用logarithmicDepthBuffer ,它似乎不起作用。 倾斜的近平面剪裁使深度陷入混乱,我从未找到解决方案。 我希望WebGL有glClipPlane 😞

@vanruesc我弄乱了代码,所以直接实现了它。 非常感谢!

@mrdoob如果您仍然在搞乱,我认为还有简化的余地...

//mirrorCamera.up.set( 0, - 1, 0 );
//mirrorCamera.up.applyMatrix4( rotationMatrix );
//mirrorCamera.up.reflect( normal ).negate();

mirrorCamera.up.set( 0, 1, 0 ).applyMatrix4( rotationMatrix ).reflect( normal );

@WestLangley谢谢!

此页面是否有帮助?
0 / 5 - 0 等级

相关问题

makc picture makc  ·  3评论

filharvey picture filharvey  ·  3评论

boyravikumar picture boyravikumar  ·  3评论

jlaquinte picture jlaquinte  ·  3评论

konijn picture konijn  ·  3评论