1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
|
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<base href="../../../" />
<script src="list.js"></script>
<script src="page.js"></script>
<link type="text/css" rel="stylesheet" href="page.css" />
</head>
<body>
[page:Object3D] → [page:Camera] →
<h1>[name]</h1>
<p class="desc">
Camera that uses [link:https://en.wikipedia.org/wiki/Perspective_(graphical) perspective projection].<br /><br />
This projection mode is designed to mimic the way the human eye sees. It is the most
common projection mode used for rendering a 3D scene.
</p>
<h2>Example</h2>
<p>[example:webgl_animation_skinning_blending animation / skinning / blending ]</p>
<p>[example:webgl_animation_skinning_morph animation / skinning / blending ]</p>
<p>[example:webgl_effects_stereo effects / stereo ]</p>
<p>[example:webgl_interactive_cubes interactive / cubes ]</p>
<p>[example:webgl_loader_collada_skinning loader / collada / skinning ]</p>
<code>var camera = new THREE.PerspectiveCamera( 45, width / height, 1, 1000 );
scene.add( camera );</code>
<h2>Constructor</h2>
<h3>[name]( [param:Number fov], [param:Number aspect], [param:Number near], [param:Number far] )</h3>
<p>
fov — Camera frustum vertical field of view.<br />
aspect — Camera frustum aspect ratio.<br />
near — Camera frustum near plane.<br />
far — Camera frustum far plane.<br /><br />
Together these define the camera's [link:https://en.wikipedia.org/wiki/Viewing_frustum viewing frustum].
</p>
<h2>Properties</h2>
<p>
See the base [page:Camera] class for common properties.<br>
Note that after making changes to most of these properties you will have to call
[page:PerspectiveCamera.updateProjectionMatrix .updateProjectionMatrix] for the changes to take effect.
</p>
<h3>[property:Float aspect]</h3>
<p>Camera frustum aspect ratio, usually the canvas width / canvas height. Default is *1* (square canvas).</p>
<h3>[property:Float far]</h3>
<p>
Camera frustum far plane. Default is *2000*.<br /><br />
The valid range is between the current value of the [page:.near near] plane and infinity.
</p>
<h3>[property:Float filmGauge]</h3>
<p>Film size used for the larger axis. Default is 35 (millimeters). This parameter does not influence the projection matrix unless .filmOffset is set to a nonzero value.</p>
<h3>[property:Float filmOffset]</h3>
<p>Horizontal off-center offset in the same unit as .filmGauge. Default is *0*.</p>
<h3>[property:Float focus]</h3>
<p>Object distance used for stereoscopy and depth-of-field effects.
This parameter does not influence the projection matrix unless a [page:StereoCamera] is being used.
Default is *10*.
</p>
<h3>[property:Float fov]</h3>
<p>Camera frustum vertical field of view, from bottom to top of view, in degrees. Default is *50*.</p>
<h3>[property:Boolean isPerspectiveCamera]</h3>
<p>
Used to test whether this or derived classes are PerspectiveCameras. Default is *true*.<br /><br />
This should not be changed as it is used internally by the renderer for optimisation.
</p>
<h3>[property:Float near]</h3>
<p>
Camera frustum near plane. Default is *0.1*.<br /><br />
The valid range is greater than 0 and less than the current value of the [page:.far far] plane.
Note that, unlike for the [page:OrthographicCamera], *0* is <em>not</em> a valid value
for a PerspectiveCamera's near plane.
</p>
<h3>[property:Object view]</h3>
<p>
Frustum window specification or null.
This is set using the [page:PerspectiveCamera.setViewOffset .setViewOffset] method
and cleared using [page:PerspectiveCamera.clearViewOffset .clearViewOffset].
</p>
<h3>[property:number zoom]</h3>
<p>Gets or sets the zoom factor of the camera. Default is *1*.</p>
<h2>Methods</h2>
<p>See the base [page:Camera] class for common methods.</p>
<h3>[method:null clearViewOffset]()</h3>
<p>Removes any offset set by the [page:PerspectiveCamera.setViewOffset .setViewOffset] method.</p>
<h3>[method:Float getEffectiveFOV]()</h3>
<p>Returns the current vertical field of view angle in degrees considering .zoom.</p>
<h3>[method:Float getFilmHeight]()</h3>
<p>
Returns the height of the image on the film. If .aspect is less than or equal to one
(portrait format), the result equals .filmGauge.
</p>
<h3>[method:Float getFilmWidth]()</h3>
<p>
Returns the width of the image on the film. If .aspect is greater than or equal to one
(landscape format), the result equals .filmGauge.
</p>
<h3>[method:Float getFocalLength]()</h3>
<p>Returns the focal length of the current .fov in respect to .filmGauge.</p>
<h3>[method:null setFocalLength]( [param:Float focalLength] )</h3>
<p>
Sets the FOV by focal length in respect to the current [page:PerspectiveCamera.filmGauge .filmGauge].<br /><br />
By default, the focal length is specified for a 35mm (full frame) camera.
</p>
<h3>[method:null setViewOffset]( [param:Float fullWidth], [param:Float fullHeight], [param:Float x], [param:Float y], [param:Float width], [param:Float height] )</h3>
<p>
fullWidth — full width of multiview setup<br />
fullHeight — full height of multiview setup<br />
x — horizontal offset of subcamera<br />
y — vertical offset of subcamera<br />
width — width of subcamera<br />
height — height of subcamera
</p>
<p>
Sets an offset in a larger frustum. This is useful for multi-window or multi-monitor/multi-machine setups.
</p>
<p>
For example, if you have 3x2 monitors and each monitor is 1920x1080 and the monitors are in grid like this:<br />
<pre>
+---+---+---+
| A | B | C |
+---+---+---+
| D | E | F |
+---+---+---+
</pre>
then for each monitor you would call it like this:<br />
<code>var w = 1920;
var h = 1080;
var fullWidth = w * 3;
var fullHeight = h * 2;
// A
camera.setViewOffset( fullWidth, fullHeight, w * 0, h * 0, w, h );
// B
camera.setViewOffset( fullWidth, fullHeight, w * 1, h * 0, w, h );
// C
camera.setViewOffset( fullWidth, fullHeight, w * 2, h * 0, w, h );
// D
camera.setViewOffset( fullWidth, fullHeight, w * 0, h * 1, w, h );
// E
camera.setViewOffset( fullWidth, fullHeight, w * 1, h * 1, w, h );
// F
camera.setViewOffset( fullWidth, fullHeight, w * 2, h * 1, w, h );
</code>
Note there is no reason monitors have to be the same size or in a grid.
</p>
<h3>[method:null updateProjectionMatrix]()</h3>
<p>
Updates the camera projection matrix. Must be called after any change of parameters.
</p>
<h3>[method:Object toJSON]([param:object meta])</h3>
<p>
meta -- object containing metadata such as textures or images in objects' descendants.<br />
Convert the camera to three.js [link:https://github.com/mrdoob/three.js/wiki/JSON-Object-Scene-format-4 JSON Object/Scene format].
</p>
<h2>Source</h2>
<p>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
</p>
</body>
</html>
|
