Skip to content

Commit f9e0046

Browse files
mrdoobmrdoob
authored
Merge pull request #17144 from Mugen87/dev30
Docs: Added page for EffectComposer.
2 parents 6705f9e + 4b69c49 commit f9e0046

File tree

3 files changed

+316
-0
lines changed

3 files changed

+316
-0
lines changed

‎docs/examples/en/postprocessing/EffectComposer.html‎

Lines changed: 155 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,155 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="utf-8" />
5+
<base href="../../../" />
6+
<script src="list.js"></script>
7+
<script src="page.js"></script>
8+
<link type="text/css" rel="stylesheet" href="page.css" />
9+
</head>
10+
<body>
11+
12+
<h1>[name]</h1>
13+
14+
<p class="desc">
15+
Used to implement post-processing effects in three.js. The class manages a chain of post-processing passes
16+
to produce the final visual result. Post-processing passes are executed in order of their addition/insertion.
17+
The last pass is automatically rendered to screen.
18+
</p>
19+
20+
<h2>Examples</h2>
21+
22+
<p>
23+
[example:webgl_postprocessing postprocessing]<br />
24+
[example:webgl_postprocessing_advanced postprocessing advanced]<br />
25+
[example:webgl_postprocessing_backgrounds postprocessing backgrounds]<br />
26+
[example:webgl_postprocessing_crossfade postprocessing crossfade]<br />
27+
[example:webgl_postprocessing_dof postprocessing depth-of-field]<br />
28+
[example:webgl_postprocessing_dof2 postprocessing depth-of-field 2]<br />
29+
[example:webgl_postprocessing_fxaa postprocessing fxaa]<br />
30+
[example:webgl_postprocessing_glitch postprocessing glitch]<br />
31+
[example:webgl_postprocessing_godrays postprocessing godrays]<br />
32+
[example:webgl_postprocessing_masking postprocessing masking]<br />
33+
[example:webgl_postprocessing_nodes postprocessing node material]<br />
34+
[example:webgl_postprocessing_outline postprocessing outline]<br />
35+
[example:webgl_postprocessing_pixel postprocessing pixelate]<br />
36+
[example:webgl_postprocessing_procedural postprocessing procedural]<br />
37+
[example:webgl_postprocessing_rgb_halftone postprocessing rgb halftone]<br />
38+
[example:webgl_postprocessing_sao postprocessing sao]<br />
39+
[example:webgl_postprocessing_smaa postprocessing smaa]<br />
40+
[example:webgl_postprocessing_sobel postprocessing sobel]<br />
41+
[example:webgl_postprocessing_ssaa postprocessing ssaa]<br />
42+
[example:webgl_postprocessing_ssao postprocessing ssao]<br />
43+
[example:webgl_postprocessing_taa postprocessing taa]<br />
44+
[example:webgl_postprocessing_unreal_bloom postprocessing unreal bloom]<br />
45+
[example:webgl_postprocessing_unreal_bloom_selective postprocessing unreal bloom selective]<br />
46+
</p>
47+
48+
<h2>Constructor</h2>
49+
50+
51+
<h3>[name]( [param:WebGLRenderer renderer], [param:WebGLRenderTarget renderTarget] )</h3>
52+
<p>
53+
[page:WebGLRenderer renderer] -- The renderer used to render the scene. <br />
54+
[page:WebGLRenderTarget renderTarget] -- (optional) A preconfigured render target internally used by [name].
55+
</p>
56+
57+
<h2>Properties</h2>
58+
59+
<h3>[property:Boolean passes]</h3>
60+
<p>
61+
An array representing the (ordered) chain of post-processing passes.
62+
</p>
63+
64+
<h3>[property:WebGLRendererTarget readBuffer]</h3>
65+
<p>
66+
A reference to the internal read buffer. Passes usually read the previous render result from this buffer.
67+
</p>
68+
69+
<h3>[property:WebGLRenderer renderer]</h3>
70+
<p>
71+
A reference to the internal renderer.
72+
</p>
73+
74+
<h3>[property:Boolean renderToScreen]</h3>
75+
<p>
76+
Whether the final pass is rendered to the screen (default framebuffer) or not.
77+
</p>
78+
79+
<h3>[property:WebGLRendererTarget writeBuffer]</h3>
80+
<p>
81+
A reference to the internal write buffer. Passes usually write their result into this buffer.
82+
</p>
83+
84+
<h2>Methods</h2>
85+
86+
<h3>[method:void addPass]( [param:Pass pass] )</h3>
87+
88+
<p>
89+
pass -- The pass to add to the pass chain.<br /><br />
90+
91+
Adds the given pass to the pass chain.
92+
</p>
93+
94+
<h3>[method:void insertPass]( [param:Pass pass], [param:Integer index] )</h3>
95+
96+
<p>
97+
pass -- The pass to insert into the pass chain.<br />
98+
index -- Defines the position in the pass chain where the pass should be inserted.<br /><br />
99+
100+
Inserts the given pass into the pass chain at the given index.
101+
</p>
102+
103+
<h3>[method:boolean isLastEnabledPass]( [param:Integer passIndex] )</h3>
104+
105+
<p>
106+
passIndex -- The pass to check.<br /><br />
107+
108+
Returns true if the pass for the given index is the last enabled pass in the pass chain.
109+
Used by [name] to determine when a pass should be rendered to screen.
110+
</p>
111+
112+
<h3>[method:void render]( [param:Float deltaTime] )</h3>
113+
114+
<p>
115+
deltaTime -- The delta time value.<br /><br />
116+
117+
Executes all enabled post-processing passes in order to produce the final frame.
118+
</p>
119+
120+
<h3>[method:void reset]( [param:WebGLRenderTarget renderTarget] )</h3>
121+
122+
<p>
123+
[page:WebGLRenderTarget renderTarget] -- (optional) A preconfigured render target internally used by [name]..<br /><br />
124+
125+
Resets the internal state of the [name].
126+
</p>
127+
128+
<h3>[method:void setPixelRatio]( [param:Float pixelRatio] )</h3>
129+
130+
<p>
131+
pixelRatio -- The device pixel ratio.<br /><br />
132+
133+
Sets device pixel ratio. This is usually used for HiDPI device to prevent bluring output.
134+
Thus, the semantic of the method is similar to [page:WebGLRenderer.setPixelRatio]().
135+
</p>
136+
137+
<h3>[method:void setSize]( [param:Integer width], [param:Integer height] )</h3>
138+
139+
<p>
140+
width -- The width of the [name].<br />
141+
height -- The height of the [name].<br /><br />
142+
143+
Resizes the internal render buffers and passes to (width, height) with device pixel ratio taken into account.
144+
Thus, the semantic of the method is similar to [page:WebGLRenderer.setSize]().
145+
</p>
146+
147+
<h3>[method:void swapBuffers]()</h3>
148+
149+
<p>Swaps the internal read/write buffers.</p>
150+
151+
<h2>Source</h2>
152+
153+
[link:https://github.com/mrdoob/three.js/blob/master/examples/js/postprocessing/EffectComposer.js examples/js/postprocessing/EffectComposer.js]
154+
</body>
155+
</html>

‎docs/examples/zh/postprocessing/EffectComposer.html‎

Lines changed: 153 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,153 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="utf-8" />
5+
<base href="../../../" />
6+
<script src="list.js"></script>
7+
<script src="page.js"></script>
8+
<link type="text/css" rel="stylesheet" href="page.css" />
9+
</head>
10+
<body>
11+
12+
<h1>[name]</h1>
13+
14+
<p class="desc">
15+
TODO
16+
</p>
17+
18+
<h2>Examples</h2>
19+
20+
<p>
21+
[example:webgl_postprocessing postprocessing]<br />
22+
[example:webgl_postprocessing_advanced postprocessing advanced]<br />
23+
[example:webgl_postprocessing_backgrounds postprocessing backgrounds]<br />
24+
[example:webgl_postprocessing_crossfade postprocessing crossfade]<br />
25+
[example:webgl_postprocessing_dof postprocessing depth-of-field]<br />
26+
[example:webgl_postprocessing_dof2 postprocessing depth-of-field 2]<br />
27+
[example:webgl_postprocessing_fxaa postprocessing fxaa]<br />
28+
[example:webgl_postprocessing_glitch postprocessing glitch]<br />
29+
[example:webgl_postprocessing_godrays postprocessing godrays]<br />
30+
[example:webgl_postprocessing_masking postprocessing masking]<br />
31+
[example:webgl_postprocessing_nodes postprocessing node material]<br />
32+
[example:webgl_postprocessing_outline postprocessing outline]<br />
33+
[example:webgl_postprocessing_pixel postprocessing pixelate]<br />
34+
[example:webgl_postprocessing_procedural postprocessing procedural]<br />
35+
[example:webgl_postprocessing_rgb_halftone postprocessing rgb halftone]<br />
36+
[example:webgl_postprocessing_sao postprocessing sao]<br />
37+
[example:webgl_postprocessing_smaa postprocessing smaa]<br />
38+
[example:webgl_postprocessing_sobel postprocessing sobel]<br />
39+
[example:webgl_postprocessing_ssaa postprocessing ssaa]<br />
40+
[example:webgl_postprocessing_ssao postprocessing ssao]<br />
41+
[example:webgl_postprocessing_taa postprocessing taa]<br />
42+
[example:webgl_postprocessing_unreal_bloom postprocessing unreal bloom]<br />
43+
[example:webgl_postprocessing_unreal_bloom_selective postprocessing unreal bloom selective]<br />
44+
</p>
45+
46+
<h2>Constructor</h2>
47+
48+
49+
<h3>[name]( [param:WebGLRenderer renderer], [param:WebGLRenderTarget renderTarget] )</h3>
50+
<p>
51+
[page:WebGLRenderer renderer] -- The renderer used to render the scene. <br />
52+
[page:WebGLRenderTarget renderTarget] -- (optional) A preconfigured render target internally used by [name].
53+
</p>
54+
55+
<h2>Properties</h2>
56+
57+
<h3>[property:Boolean passes]</h3>
58+
<p>
59+
An array representing the (ordered) chain of post-processing passes.
60+
</p>
61+
62+
<h3>[property:WebGLRendererTarget readBuffer]</h3>
63+
<p>
64+
A reference to the internal read buffer. Passes usually read the previous render result from this buffer.
65+
</p>
66+
67+
<h3>[property:WebGLRenderer renderer]</h3>
68+
<p>
69+
A reference to the internal renderer.
70+
</p>
71+
72+
<h3>[property:Boolean renderToScreen]</h3>
73+
<p>
74+
Whether the final pass is rendered to the screen (default framebuffer) or not.
75+
</p>
76+
77+
<h3>[property:WebGLRendererTarget writeBuffer]</h3>
78+
<p>
79+
A reference to the internal write buffer. Passes usually write their result into this buffer.
80+
</p>
81+
82+
<h2>Methods</h2>
83+
84+
<h3>[method:void addPass]( [param:Pass pass] )</h3>
85+
86+
<p>
87+
pass -- The pass to add to the pass chain.<br /><br />
88+
89+
Adds the given pass to the pass chain.
90+
</p>
91+
92+
<h3>[method:void insertPass]( [param:Pass pass], [param:Integer index] )</h3>
93+
94+
<p>
95+
pass -- The pass to insert into the pass chain.<br />
96+
index -- Defines the position in the pass chain where the pass should be inserted.<br /><br />
97+
98+
Inserts the given pass into the pass chain at the given index.
99+
</p>
100+
101+
<h3>[method:boolean isLastEnabledPass]( [param:Integer passIndex] )</h3>
102+
103+
<p>
104+
passIndex -- The pass to check.<br /><br />
105+
106+
Returns true if the pass for the given index is the last enabled pass in the pass chain.
107+
Used by [name] to determine when a pass should be rendered to screen.
108+
</p>
109+
110+
<h3>[method:void render]( [param:Float deltaTime] )</h3>
111+
112+
<p>
113+
deltaTime -- The delta time value.<br /><br />
114+
115+
Executes all enabled post-processing passes in order to produce the final frame.
116+
</p>
117+
118+
<h3>[method:void reset]( [param:WebGLRenderTarget renderTarget] )</h3>
119+
120+
<p>
121+
[page:WebGLRenderTarget renderTarget] -- (optional) A preconfigured render target internally used by [name]..<br /><br />
122+
123+
Resets the internal state of the [name].
124+
</p>
125+
126+
<h3>[method:void setPixelRatio]( [param:Float pixelRatio] )</h3>
127+
128+
<p>
129+
pixelRatio -- The device pixel ratio.<br /><br />
130+
131+
Sets device pixel ratio. This is usually used for HiDPI device to prevent bluring output.
132+
Thus, the semantic of the method is similar to [page:WebGLRenderer.setPixelRatio]().
133+
</p>
134+
135+
<h3>[method:void setSize]( [param:Integer width], [param:Integer height] )</h3>
136+
137+
<p>
138+
width -- The width of the [name].<br />
139+
height -- The height of the [name].<br /><br />
140+
141+
Resizes the internal render buffers and passes to (width, height) with device pixel ratio taken into account.
142+
Thus, the semantic of the method is similar to [page:WebGLRenderer.setSize]().
143+
</p>
144+
145+
<h3>[method:void swapBuffers]()</h3>
146+
147+
<p>Swaps the internal read/write buffers.</p>
148+
149+
<h2>Source</h2>
150+
151+
[link:https://github.com/mrdoob/three.js/blob/master/examples/js/postprocessing/EffectComposer.js examples/js/postprocessing/EffectComposer.js]
152+
</body>
153+
</html>

‎docs/list.js‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -384,6 +384,10 @@ var list = {
384384
"Lensflare": "examples/en/objects/Lensflare",
385385
},
386386

387+
"Post-Processing": {
388+
"EffectComposer": "examples/en/postprocessing/EffectComposer"
389+
},
390+
387391
"Exporters": {
388392
"GLTFExporter": "examples/en/exporters/GLTFExporter",
389393
"PLYExporter": "examples/en/exporters/PLYExporter",
@@ -815,6 +819,10 @@ var list = {
815819
"Lensflare": "examples/zh/objects/Lensflare",
816820
},
817821

822+
"Post-Processing": {
823+
"EffectComposer": "examples/zh/postprocessing/EffectComposer"
824+
},
825+
818826
"导出器": {
819827
"GLTFExporter": "examples/zh/exporters/GLTFExporter",
820828
"PLYExporter": "examples/zh/exporters/PLYExporter"

0 commit comments

Comments
 (0)