from How to position the camera so that the object always has the same pixel width and height on the screen?
in your case is more likely dependent on the smaller window size axis !!!
- because aspect ratio equations usually differs
- for width > height and width < height
- most renders have taken this behaviour from OpenGL
- so may be your code needs adding one if to be complete :)
- to be sure just resize your window to be bigger in height then width and see what happens
btw. the math behind is just simple triangle math
- one angle = 90 deg
-
second is atan (h1/z1) = atan (h0/z0)
h1/z1 = h0/z0 <- triangle similarity z1 = z0*h1/h0 <- this is what you want -
h0 is your half size in control axis (x or y)
- h1 is half cube size
- z0 is near plane of your frustrum
- z1 is cube position (do not forget to add the offset to center of cube)
- so cube center position is: z1' = (z0*h1/h0)+h1
------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
http://stackoverflow.com/questions/15331358/three-js-get-object-size-with-respect-to-camera-and-object-position-on-screen
I am newbie to 3D programming, I did started to explore the 3D world from WebGL with Three.JS.
I want to predetermine object size while i change the camera.position.z and object "Z" position.
For example: i have a cube mesh at size of 100x100x100.
cube = new THREE.Mesh(
new THREE.CubeGeometry(100, 100, 100, 1,1,1, materials),
new THREE.MeshFaceMaterial()
);
and cam with aspect ratio of 1.8311874
camera = new THREE.PerspectiveCamera( 45, aspect_ration, 1, 30000 );
I want to know size (2D width & height) of that cube object on screen when,
camera.position.z = 750;
cube.position.z = 500;
Is there is any way to find/predetermine it?
You can compute the visible height for a given distance from the camera using the formulas explained in Three.js - Width of view.
var vFOV = camera.fov * Math.PI / 180; // convert vertical fov to radians
var height = 2 * Math.tan( vFOV / 2 ) * dist; // visible height
In your case the camera FOV is 45 degrees, so
vFOV = PI/4.
(Note: in three.js the camera field-of-view FOV is the vertical one, not the horizontal one.)
The distance from the camera to the front face (important!) of the cube is 750 - 500 - 50 = 200. Therefore, the visible height in your case is
height = 2 * tan( PI/8 ) * 200 = 165.69.
Since the front face of the cube is 100 x 100, the fraction of the visible height represented by the cube is
fraction = 100 / 165.69 = 0.60.
So if you know the canvas height in pixels, then the height of the cube in pixels is 0.60 times that value.
The link I provided shows how to compute the visible width, so you can do that calculation in a similar fashion if you need it.