Open menghuaa opened 1 month ago
Would it be possible for you to switch over to WebGPURenderer
? This issue is already solved there:
https://jsfiddle.net/xasqgp4v/
The mirror creation is different compared to WebGLRenderer
but with the new material system you can easier control how the mirror effect should look like.
I cannot use WebGPURenderer, I can only use WebGLRenderer. How should I modify it? Why can't the reflector be displayed when using an OrthographicCamera?
The problem is the dependency to projective texture mapping which is implemented differently with the new material. It is fixable but it requires some refactoring in Reflector
.
The problem is the dependency to projective texture mapping which is implemented differently with the new material. It is fixable but it requires some refactoring in
Reflector
. @Mugen87 I want to refactor Reflector to make WebGL support OrthographicCamera create mirror. Can you indicate some directions for modification or provide me with some reference materials?
I think we have to move away from texture2DProj()
and a separate texture matrix and use uv
coordinates like in WebGPURenderer
instead.
I think we have to move away from
texture2DProj()
and a separate texture matrix and useuv
coordinates like inWebGPURenderer
instead.
Also, I would like to know how long it will take to refactor the reflector? I have an urgent task that needs to be completed next Thursday. Is there any other way to use Threejs to achieve mirroring in orthogonal cameras besides using Reflexor? If have, can you provide me with an implementation idea?
Sorry, but this is a low-priority issue so I doubt somebody from the core team is going to working on this soon.
Please ask at the forum if you need help for an implementation.
Sorry, but this is a low-priority issue so I doubt somebody from the core team is going to working on this soon.
Please ask at the forum if you need help for an implementation.
Someone raised this question at thr forum a long time ago, but no one replied. I am a beginner in Threejs and I would like to know if there are any simple methods to achieve mirror.
@menghuaa Friendly tip:
camera = new THREE.OrthographicCamera( -window.innerWidth/2, window.innerWidth/2, window.innerHeight/2, -window.innerHeight/2, 0.1, 1000 )
That is incorrect in your example. See this StackOverflow answer for how to instantiate an orthographic camera. Also see how @Mugen87 instantiates it in https://jsfiddle.net/xasqgp4v/.
I cannot use WebGPURenderer, I can only use WebGLRenderer. I would like to know if there are any simple methods to achieve mirror.
I hear you, but to clarify, another possible workaround is to use WebGPURenderer
, but force the WebGL back-end.
renderer = new THREE.WebGPURenderer( { antialias: true, forceWebGL: true } );
ut to clarif @WestLangley @Mugen87 I would like to know how long it would take for me to refactor Refactor myself? Also, because I render a lot of objects in the scene, would it make an error if I simply replace webglrender with webgpurender and use the functions in the original Three.module.js for other parts?
I cannot use WebGPURenderer, I can only use WebGLRenderer. I would like to know if there are any simple methods to achieve mirror.
I hear you, but to clarify, another possible workaround is to use
WebGPURenderer
, but force the WebGL back-end.renderer = new THREE.WebGPURenderer( { antialias: true, forceWebGL: true } );
@WestLangley @Mugen87 I set renderer=new THREE WebGPURenderer( { antialias: true, forceWebGL: true } ); Is it compatible with the appearance and materials in the non GPU version of Threejs
Description
When I changed the PerspectiveCamera to an OrthographicCamera, the reflector disappeared
Reproduction steps
1.use threejs r153 2.open docs/examples/webgl_mirror.html 2.replace line68 <camera = new THREE.PerspectiveCamera( 45, window.innerWidth / window.innerHeight, 1, 500 );> with <camera=new THREE.OrthographicCamera(-window.innerWidth/2, window.innerWidth/2, window.innerHeight/2, -window.innerHeight/2, 0.1, 1000);>
Code
Live example
Screenshots
No response
Version
153
Device
Desktop
Browser
Google Chrome
OS
Windows