Calculating the FOV for the Perspective camera

Since I have no previous experience with 3D I run in to some problems that might be common knowledge to you 3D pro’s ;).
I have a wide variety of scene sizes (800×600, 1200×100 etc.).
What formula can I use to make sure that an object with a z position of 0 and a width and height that is the same as the scene fills up the entire scene.

E.g.: Object Mesh A is 1200×100 and is on Z position 0. The scene is 1200×100 as well. The camera is on z position 1500. What is the FOV to make the object fill the scene?

Something along the line of ((A / B ) * C) is what I’m looking for :D.

Infinite amount of kudos to whoever is brilliant enough to answer my question 🙂

Author: Fantashit

3 thoughts on “Calculating the FOV for the Perspective camera

  1. The visible height given the vertical field-of-view vFOV and distance from the camera dist is

    height = 2 * Math.tan( ( vFOV / 2 ) ) * dist;

    The visible width is

    aspect = window_width / window_height;
    hFOV = 2 * Math.atan( Math.tan( vFOV / 2 ) * aspect );
    width  = 2 * Math.tan( ( hFOV / 2 ) ) * dist;

    The field-of-view parameter for the camera in THREE.js is the vertical one.

    Use the two sets of equations to calculate the required vFOV twice, and select the larger answer.

  2. In your fiddle,

    height = height of your plane mesh = 500.

    distance = camera.z – plane.z = 1000 – 100 = 900.

    vFOV = 2 * Math.atan( height / ( 2 * distance ) ) = 0.5419 radians, or 31.04 degrees.

  3. Thank you @WestLangley !!
    Since it took me a while to realize I needed to add a conversion from radiants to degrees, I’m adding here an example with the final code:

    var distance = 1000;
    var FOV = 2 * Math.atan( window.innerHeight / ( 2 * distance ) ) * 180 / Math.PI;
    var camera = new THREE.PerspectiveCamera( FOV, window.innerWidth/window.innerHeight, 0.1, distance );
    camera.position.z = distance;

Comments are closed.