Three.js: Artefactos de ejemplo de WebGL Mirror

Creado en 17 ago. 2017  ·  5Comentarios  ·  Fuente: mrdoob/three.js

Los artefactos se pueden reproducir haciendo zoom y moviendo un poco la cámara.

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

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

Versión Three.js
  • [x] Desarrollo
  • [x] r86
Navegador
  • [x] Chrome
SO
  • [x] macOS
Bug

Comentario más útil

@mrdoob Si todavía estás jugando, creo que hay espacio para la simplificación ...

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

Todos 5 comentarios

En efecto.
Consulte también este tema: https://github.com/mrdoob/three.js/issues/11885
Al final tengo la sensación de que el Mirror no se ha implementado correctamente.

La relación de aspecto de la cámara principal nunca se copia en la cámara espejo.

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

Debería cambiarse a:

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

¡Enviaré un PR para esto más tarde!

Otro problema con el espejo (y el océano plano) es que no parece funcionar cuando logarithmicDepthBuffer está habilitado. El recorte oblicuo cerca del plano afecta la profundidad y nunca encontré una solución para esto. Ojalá WebGL tuviera glClipPlane 😞

@vanruesc Estaba jugando con el código, así que lo implementé directamente. ¡Muchas gracias!

@mrdoob Si todavía estás jugando, creo que hay espacio para la simplificación ...

//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 ¡Gracias!

¿Fue útil esta página
0 / 5 - 0 calificaciones

Temas relacionados

donmccurdy picture donmccurdy  ·  3Comentarios

fuzihaofzh picture fuzihaofzh  ·  3Comentarios

boyravikumar picture boyravikumar  ·  3Comentarios

jlaquinte picture jlaquinte  ·  3Comentarios

filharvey picture filharvey  ·  3Comentarios