0

I want to set CubeGeometry touch to the canvas and I used this fovFormula but it didn't work out. This CubeGeometry is going out of canvas. 

var height = 500;
var distance = 1000;
var fov = 2 * Math.atan((height) / (2 * distance)) * (180 / Math.PI);
itsLeftCamera = new THREE.PerspectiveCamera(fov , 400 / 500, 1.0, 1000);

If I am calculating wrong so, please guide me how to overcome this problem? and I want to set this in generalize way so at any position of Perspective camera, this geometry would perfectly touch to my canvas and this geometry should be in center of the canvas.

Mhd
  • 771
  • 1
  • 8
  • 15
  • Because, CubeGeometry is going out of canvas :( – Mhd Sep 07 '17 at 15:26
  • Right. I got it. Is this the correct method of calculation - > " distance = camera.z - plane.z" If not. Please correct me. – Mhd Sep 07 '17 at 15:33

1 Answers1

3

IMO you should calculate for the diagonal instead of the height in the fov calculator because when doing for height you focus on height thereby cutting off width portion greater than height.... When you do for diagonal your camera focus on the entire rectangle...so code imo should be

var height = 500; //Height of the viewport
var width = 400; //Width of the viewPort
var distance = 1000; //Distance of the viewer from the viewport

var diag = Math.sqrt((height*height)+(width*width))
var fov = 2 * Math.atan((diag) / (2 * distance)) * (180 / Math.PI);
itsLeftCamera = new THREE.PerspectiveCamera(fov , width / height, 0.1, distance);
Julian Frank
  • 31
  • 5