I am new to utilizing three.js and I am currently attempting to create a 2D visualization using these 3D tools for layered sprites. I am looking for guidance on the arguments for PerspectiveCamera() and camera.position.set(). I have received some helpful hints from this answer to a related question, suggesting to set the z coordinate as 0 in camera.position.set(x,y,z).
Below is a code snippet that I am modifying from one of stemkoski's three.js examples. I am struggling with determining the values for VIEW_ANGLE, x, and y. If I intend to achieve a flat camera view on a plane the size of the screen, how should I assign these variables? I've experimented with various values but it is difficult to decipher the visual outcome. Thank you in advance!
var SCREEN_WIDTH = window.innerWidth, SCREEN_HEIGHT = window.innerHeight;
var VIEW_ANGLE = ?, ASPECT = SCREEN_WIDTH / SCREEN_HEIGHT, NEAR = 0.1, FAR = 20000;
camera = new THREE.PerspectiveCamera( VIEW_ANGLE, ASPECT, NEAR, FAR);
scene.add(camera);
var x = ?, y = ?, z = 0;
camera.position.set(x,y,z);
camera.lookAt(scene.position);
UPDATE - perspective vs orthographic camera:
Thank you @GuyGood, I understand that I need to decide between a perspective camera and an orthographic camera. I now realize that even in this 2D context, the PerspectiveCamera() would offer effects like parallax, while OrthographicCamera() would provide consistent rendering sizes regardless of layer depth in the 2D element. I am leaning towards using the PerspectiveCamera() for subtle parallax effects between sprite layers (indicating my project may not be entirely 2D!).
Therefore, ensuring that all sprite layers are parallel to the viewing plane is crucial, and that camera.position.set() signifies the orthogonal viewpoint line to the center of the field of view. This concept might be fundamental to many individuals here, but it feels like a whole new realm to me!
I am still grappling with understanding the significance of VIEW_ANGLE, x, and y, as well as the distance between the camera and the near and far viewing planes in a 2D visualization. With the orthographic camera, this factor seems insignificant - there just needs to be enough depth to include all desired layers and a suitable viewing plane scale for the sprites. However, with the perspective camera, the depth and viewing field affect the parallax effect; are there any additional considerations to contemplate?
UPDATE 2 - Angle of view and other variables:
After further exploration into comprehending the Angle of View (Field of View, or FOV) for the camera and the x,y,z arguments for camera position, I found a useful video overview about Field of View in game design (relevant to answering questions for my 2D visualization project). Alongside this Field of View tutorial for photographers, which was informative (albeit slightly cheesy), these resources provided insights into selecting a Field of View for my project and the implications of wide or narrow Fields of View (measured in degrees out of 360). Optimal outcomes involve a mix of natural human field of vision based on screen proximity and relative scale differences between foreground and background elements in the visualization. Wider fields diminish the background, while narrower fields accentuate it - a similar though less pronounced effect compared to an orthographic camera. I hope this information proves as beneficial to you as it has been for me!
UPDATE 3 - Further reading
If you are interested in delving deeper into camera specifications across various applications, check out chapter 13 of Computer Graphics Principles and Practice. It has been invaluable in addressing my previous inquiries and more.
UPDATE 4 - Considerations for the z dimension in the Orthographic camera
During my ongoing project, I opted for the orthographic camera to increment the z dimensions of my sprites to prevent z-fighting without them appearing progressively distant. Contrastingly, adjusting size creates the illusion of a sprite receding into the distance. Nevertheless, I encountered a minor error today that I wish to highlight to save others from similar issues. Although the orthographic camera does not depict diminishing sizes over distance, remember there is still a past where objects will be removed from view due to a back frustrum plane. Today, I mistakenly exceeded the z values for several objects and couldn't identify why they weren't visible on screen. The z-coordinate is easy to overlook when working with the orthographic camera.