-
-
Notifications
You must be signed in to change notification settings - Fork 35.6k
/
Copy pathOrthographicCamera.html
137 lines (104 loc) · 4.69 KB
/
OrthographicCamera.html
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
<!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/Orthographic_projection orthographic projection].<br /><br />
In this projection mode, an object's size in the rendered image stays constant
regardless of its distance from the camera.<br /><br />
This can be useful for rendering 2D scenes and UI elements, amongst other things.
</p>
<h2>Example</h2>
<p>[example:webgl_camera camera ]</p>
<p>[example:webgl_interactive_cubes_ortho interactive / cubes / ortho ]</p>
<p>[example:webgl_materials_cubemap_dynamic materials / cubemap / dynamic ]</p>
<p>[example:webgl_postprocessing_advanced postprocessing / advanced ]</p>
<p>[example:webgl_postprocessing_dof2 postprocessing / dof2 ]</p>
<p>[example:webgl_postprocessing_godrays postprocessing / godrays ]</p>
<p>[example:webgl_rtt rtt ]</p>
<p>[example:webgl_shaders_tonemapping shaders / tonemapping ]</p>
<p>[example:webgl_shadowmap shadowmap ]</p>
<code>var camera = new THREE.OrthographicCamera( width / - 2, width / 2, height / 2, height / - 2, 1, 1000 );
scene.add( camera );</code>
<h2>Constructor</h2>
<h3>[name]( [param:Number left], [param:Number right], [param:Number top], [param:Number bottom], [param:Number near], [param:Number far] )</h3>
<p>
left — Camera frustum left plane.<br />
right — Camera frustum right plane.<br />
top — Camera frustum top plane.<br />
bottom — Camera frustum bottom plane.<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:OrthographicCamera.updateProjectionMatrix .updateProjectionMatrix] for the changes to take effect.
</p>
<h3>[property:Float bottom]</h3>
<p>Camera frustum bottom plane.</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 left]</h3>
<p>Camera frustum left plane.</p>
<h3>[property:Float near]</h3>
<p>
Camera frustum near plane. Default is *0.1*.<br /><br />
The valid range is between 0 and the current value of the [page:.far far] plane.
Note that, unlike for the [page:PerspectiveCamera], *0* is a valid value for an
OrthographicCamera's near plane.
</p>
<h3>[property:Float right]</h3>
<p>Camera frustum right plane.</p>
<h3>[property:Float top]</h3>
<p>Camera frustum top plane.</p>
<h3>[property:Object view]</h3>
<p>Set by [page:OrthographicCamera.setViewOffset setViewOffset]. Default is *null*.</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 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<br /><br />
Sets an offset in a larger [link:https://en.wikipedia.org/wiki/Viewing_frustum viewing frustum].
This is useful for multi-window or multi-monitor/multi-machine setups.
For an example on how to use it see [page:PerspectiveCamera.setViewOffset PerspectiveCamera].
</p>
<h3>[method:null clearViewOffset]()</h3>
<p>
Removes any offset set by the .setViewOffset method.
</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>