"WebGL" 3. Camera

Type of camera: There are two cameras in WebGL: a positive projection camera and a perspective camera

1. Positive projection camera Orthographiccamera: Similar to the angle of view in engineering drawings, ignoring the near and far distance, the proportion of objects near and far is constant, more used in scientific research, engineering drawing application

Orthographiccamera (left, right, Top,bottom, near, far)

Left: the vertical distance from the center point of the camera. As you can see, the left plane is the plane inside the screen.

Right: The vertical distance from the center point of the camera. As can be seen, the right plane is slightly outside the screen of that plane.

Top: The vertical distance of the top plane from the center point of the camera. The top plane of the box is the plane of the cuboid head.

Bottom: The vertical distance from the base plane to the center point of the camera. The bottom plane is the plane of the head toward the ground.

Near: The vertical distance from the center point of the camera to the nearest plane. The near plane is the flat on the left.

Far: the vertical distance from the center point of the camera from the remote plane. The far plane is the plane on the right.

General Common settings:

var camera = new three. Orthographiccamera (Width/-2, WIDTH/2, HEIGHT/2, Height/-2, 1, 1000);

Scene.add (camera);

2. Perspective camera Perspectivecamera: Similar to the real-world camera, near the object proportion is large, the farther the object proportion smaller

Perspectivecamera (FoV, Aspect, near, far)

1, Perspective FoV: eyes open angle, that is, the size of the angle of view, if set to 0, pretty close your eyes, so what can not see, if it is 180, then you may think that your horizon is very broad, but at 180 degrees, often the object is very small, because he in your entire visual area of the proportion becomes smaller.

2. Near surface: Indicates the distance from the cutting surface near you. Add, you can also think of the distance from the eye distance, assuming 10 meters away, please do not set a negative value, three.js silly, do not know how to forget,

3, far plane distant: to show you in the distance of the cutting surface,

4. Aspect ratio aspect: the aspect ratio of the actual window, that is, the width divided by the height. The larger the value, the bigger the width, the more you might see widescreen films, if the value is less than 1, then you see a wide-cocked widescreen

Scene Settings:

? var camera = new three. Perspectivecamera (Width/height, 1, 1000);? Scene.add (camera);

"WebGL" 3. Camera