Why mirror can't appear again?

I used threejs code to place mirrors at various angle.
In the screenshot I putmirros at 45 degree angle but the images only 4 .
Mirror not seen after second images
In real , mirror can form more images .
Just don’t know whaat happen??
Screenshot -

1 Like

Screenshot is -
Screenshot%20(7)

Code is -
Mirror 1 -
var geometry = new THREE.PlaneBufferGeometry( 100, 100 );
var verticalMirror = new THREE.Reflector( geometry, {
clipBias: 0.003,
textureWidth: WIDTH * window.devicePixelRatio,
textureHeight: HEIGHT * window.devicePixelRatio,
color: 0x889999,
recursion: 1
} );
verticalMirror.position.y = 50;
verticalMirror.position.z = - 50;
scene.add( verticalMirror );
Mirror 2 -

var geometry = new THREE.PlaneBufferGeometry( 100, 100 );
		verticalMirror45 = new THREE.Reflector( geometry, {
				clipBias: 0.003,
				textureWidth: WIDTH * window.devicePixelRatio,
				textureHeight: HEIGHT * window.devicePixelRatio,
				color: 0x889999,
				recursion: 1
			} );
			verticalMirror45.rotateY(  Math.PI/ 1.33 );
			verticalMirror45.position.x = -15;
			verticalMirror45.position.y = 50;
			verticalMirror45.position.z =  -15;
			scene.add( verticalMirror45 );

My question again mirror why can’t reflected after second image.

1 Like

You’re trying to get something that looks like this, where the image is repeated many times:

nickieatmirror

Is that right?

This won’t work - the Reflector.js is not a physically accurate mirror, it’s designed to give an approximation of a mirror that is fast enough to run inside a web browser at a high frame rate.

It will only reflect one time. If you put two mirrors across from each other, it will not reflect the reflection of the second mirror.

It’s not clear from your image, but I guess when you put two mirrors in the scene then whichever is rendered second will include a reflection of whichever is rendered first, but not the other way around.

3 Likes

Thanks for giving information. I don’t no about it.
Yes I want that type of mirror. I want to show to show how multiple images can be formed using mirror.
Please help how can I achieve this in a three.js
Any other function or code to reflect more than one times.

Is it possible with using Aframe in threejs ???
Please help.

What happens when you increase the recursion parameter of Reflector? Can you try a value of 4?

Yeah that works but it would create new mirror not the image of the mirror.
I want to show to actual mirror reflection from two mirrors.
I want to show the concept in the animation form.
When we place mirror at some angle,the no. of images form. I want to show it.
Any more idea to create a actual mirror in threejs??

No. The effect you like to achieve is apparently not supported. I guess you have to develop a custom solution for your use case.