How to set the view of multi cameras with viewport is complete?

When I use one camera, the view is like this.


When I use viewport of two cameras, the view is like this.But the view of every camera is not complete and the horizon is not compressed.

leftCamera = camera.clone('leftCamera');
				leftCamera._currentTarget = camera._currentTarget;
				rightCamera = camera.clone('rightCamera');
				rightCamera._currentTarget = camera._currentTarget;
				//leftCamera.attachControl(canvas, true);
				//rightCamera.attachControl(canvas, true);
				leftCamera.viewport = new BABYLON.Viewport(0, 0, 0.5, 1.0);
				rightCamera.viewport = new BABYLON.Viewport(0.5, 0, 0.5, 1.0);

I want to the view of every camera is complete and the horizon is compressed.


How to achieve?

Sorry I do not understand the question :frowning: Could you create a playground highlighting the issue ? That would help a lot.

Only one camera.

viewport of two cameras.The viewport of every camera is part of the viewport of one camera.

This viewport of every camera is the whole of the viewport of one camera.


This is squashing everything and the spheres are not spheres anymore, is it what you are trying to achieve?

Yes, it is.

1 Like

cc @RaananW who might have done similar things for XR, but I guess you will need to specify your own camera matrix.

1 Like

I made a similar effect here: https://playground.babylonjs.com/#7P7A02#8

Related discussion

1 Like

Thank you, this works.

2 Likes