Hi, Anybody please explain, what is Camera and What is CubeCamera. What are the use of these?
@seanwasere Thank you for your kind reply. Can you please share a realtime example for both. Because I can’t understand the usage difference between them. Can we use cubecamera instead of camera
If you did a search, you’d probably find some of my examples
Camera is a base class that is used to create other cameras. You never use
Camera directly. Instead, usually you want a
PerspectiveCamera. It’s a derived class of
Camera, you can see this at the top of the docs page:
Nearly all three.js examples use a
PerspectiveCamera, so check any of them to see it in action. It creates a view of the scene using perspective projection, which is similar to how your eyes or a real camera see the world.
CubeCamera can be used for effects like dynamic reflections. See these two examples:
Another important camera is the
OrthographicCamera which uses orthographic projection. This is similar to how blueprints of an object are drawn. This camera is useful for things like creating 2D scenes or the UI for a game.
Thank you for your reply @looeee . can we use, perspective and orthographic camera in a same project?
Yes you can. Just create two cameras (I’m skipping the parameters here, refer to the docs for info on how to create the cameras)
const persCamera = new PerspectiveCamera(); const orthoCamera = new OrthographicCamera();
Then, when you call
renderer.render, pass in whichever camera you want to use for that frame:
const renderer = new WebGLRenderer(); // render a frame with PerspectiveCamera renderer.render(scene, persCamera); // render a frame with OrthographicCamera renderer.render(scene, orthoCamera);
A common use case is to render the 3D scene using a perspective camera, then render a 2D UI on top of the scene using an orthographic camera. Many games do this. Then you would maintain two scenes, let’s call them
userInterface2DScene, and render them like so:
const renderer = new WebGLRenderer(); // render a frame of the main scene with PerspectiveCamera renderer.render(main3DScene, persCamera); // render a frame of the UI with OrthographicCamera renderer.render(userInterface2DScene, orthoCamera);
You’ll get a result like this: the 3D characters are rendered in perspective, then the menus are rendered in orthographic.
(I don’t know exactly how Fortnite sets up the menu, I’m just using this image as an example).
Thank you so much for your brief explanation @looeee . I understood now.
@looeee . Please see this example. It having orthographic camera. So , as per our discussion, it should be like 2D. But this is being as 3D. how? https://threejs.org/examples/?q=orthogra#css3d_orthographic
Take a look at this: https://en.wikipedia.org/wiki/Orthographic_projection
Thank you for your suggestion @prisoner849