javascript - calculate camera fov distance for sphere

Question

I trying to calculate the max distance the camera can zoom in on a sphere while still displaying all of the sphere on screen.

var dist =  diameter / (2 * Math.tan( camera.fov * (Math.PI/180) / 2 ));

this zooms in to much. The top and bottom of the sphere are clipped. What am i doing wrong?

fiddle

Answer 1

The sphere is being clipped for the same reason that if you stand close to a large sphere you can't see its "north pole".

You need to do the calculation for a plane that passes through the front of the sphere, not its center.

As a result, the quantity you calculated is the minimum distance to the front of the sphere. The minimum distance to its center is the quantity you calculated plus the sphere's radius.

(Note: this will yield a conservative approximation, due to the curvature of the sphere.)

EDIT: OK, here is the exact answer.

var dist =  radius / ( Math.sin( camera.fov * ( Math.PI / 180 ) / 2 ) );

fiddle: http://jsfiddle.net/x98Fk/3/

The three.js camera field-of-view is the vertical FOV, so this this the result for the vertical direction. If the window is narrower than it is wide, then you have to deal with that issue.