three-base 2.0.75 → 2.0.76
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/ApngTexture.d.ts +13 -13
- package/ApngTexture.js +61 -61
- package/ApngTextureManage.d.ts +18 -18
- package/ApngTextureManage.js +87 -87
- package/EventMesh.d.ts +18 -18
- package/EventMesh.js +59 -59
- package/ExtrudeMesh.d.ts +111 -111
- package/ExtrudeMesh.js +363 -363
- package/FPScontrol.d.ts +45 -45
- package/FPScontrol.js +171 -171
- package/Fire/Fire.d.ts +28 -28
- package/Fire/Fire.js +79 -79
- package/Fire/FireGromtry.d.ts +9 -9
- package/Fire/FireGromtry.js +40 -40
- package/Fire/FireMaterial.d.ts +28 -28
- package/Fire/FireMaterial.js +32 -32
- package/InstancedMeshBase.d.ts +32 -32
- package/InstancedMeshBase.js +234 -236
- package/InstancedMeshBase.ts +1 -4
- package/KeyFrameAnimation.d.ts +25 -25
- package/KeyFrameAnimation.js +78 -78
- package/MeshBase.d.ts +34 -34
- package/MeshBase.js +187 -187
- package/Mirror.d.ts +25 -25
- package/Mirror.js +139 -139
- package/PlaneModal1/PlaneModal1.d.ts +31 -31
- package/PlaneModal1/PlaneModal1.js +105 -105
- package/PlaneModal1/index.d.ts +1 -1
- package/PlaneModal1/index.js +1 -1
- package/PlaneText.d.ts +44 -44
- package/PlaneText.js +30 -30
- package/PlaneWithHtml.d.ts +11 -11
- package/PlaneWithHtml.js +68 -68
- package/PointLight/PointLight.d.ts +13 -13
- package/PointLight/PointLight.js +64 -64
- package/PointLight/index.d.ts +1 -1
- package/PointLight/index.js +1 -1
- package/Sky/Sky.d.ts +13 -13
- package/Sky/Sky.js +28 -28
- package/Sky/index.d.ts +1 -1
- package/Sky/index.js +1 -1
- package/SpriteModal1/SpriteModal1.d.ts +30 -30
- package/SpriteModal1/SpriteModal1.js +110 -110
- package/SpriteModal1/index.d.ts +1 -1
- package/SpriteModal1/index.js +1 -1
- package/SpriteText.d.ts +45 -45
- package/SpriteText.js +163 -163
- package/SpriteText2.d.ts +47 -47
- package/SpriteText2.js +198 -198
- package/SpriteWithHtml.d.ts +7 -7
- package/SpriteWithHtml.js +49 -49
- package/Text3D/Text3D.d.ts +20 -20
- package/Text3D/Text3D.js +62 -62
- package/Text3D/fontController.d.ts +59 -59
- package/Text3D/fontController.js +200 -200
- package/Text3D/index.d.ts +1 -1
- package/Text3D/index.js +1 -1
- package/ThreeBase.d.ts +92 -92
- package/ThreeBase.js +619 -619
- package/ThreeMouse.d.ts +39 -39
- package/ThreeMouse.js +359 -359
- package/Transition.d.ts +40 -40
- package/Transition.js +207 -207
- package/index.d.ts +1 -1
- package/index.js +2 -2
- package/keyContorls.d.ts +25 -25
- package/keyContorls.js +98 -98
- package/package.json +1 -1
- package/pass/FullScreenQuad.d.ts +7 -7
- package/pass/FullScreenQuad.js +25 -25
- package/pass/glow_pass.d.ts +2 -2
- package/pass/glow_pass.js +236 -236
- package/pass/stroke_pass.d.ts +2 -2
- package/pass/stroke_pass.js +202 -202
- package/shaders/FXAAShaderMaterial.d.ts +3 -3
- package/shaders/FXAAShaderMaterial.js +21 -21
- package/shaders.d.ts +17 -17
- package/shaders.js +99 -99
- package/threeLoader.d.ts +26 -26
- package/threeLoader.js +189 -189
- package/threeUtils.d.ts +47 -47
- package/threeUtils.js +266 -266
package/pass/glow_pass.js
CHANGED
|
@@ -1,48 +1,48 @@
|
|
|
1
|
-
/*
|
|
2
|
-
* @Author: xiaosihan
|
|
3
|
-
* @Date: 2023-05-09 00:35:17
|
|
4
|
-
* @Last Modified by: xiaosihan
|
|
5
|
-
* @Last Modified time: 2023-05-09 02:33:28
|
|
6
|
-
*/
|
|
7
|
-
import { LinearFilter, RGBAFormat, Vector2, WebGLRenderTarget, ShaderMaterial, NoBlending, Scene, RawShaderMaterial, Color, NormalBlending, ShaderChunk, DepthTexture, DepthFormat, UnsignedShortType } from "three";
|
|
8
|
-
import FullScreenQuad from "./FullScreenQuad";
|
|
9
|
-
// 选中对象的深度纹理
|
|
10
|
-
const selectDepthTexture = (() => {
|
|
11
|
-
const baseDepthTexture = new DepthTexture(4096, 4096);
|
|
12
|
-
baseDepthTexture.format = DepthFormat;
|
|
13
|
-
baseDepthTexture.type = UnsignedShortType;
|
|
14
|
-
baseDepthTexture.anisotropy = 16;
|
|
15
|
-
return baseDepthTexture;
|
|
16
|
-
})();
|
|
17
|
-
// 选中对象的纹理
|
|
18
|
-
const selectTextureTarget = new WebGLRenderTarget(512, 512, {
|
|
19
|
-
minFilter: LinearFilter,
|
|
20
|
-
magFilter: LinearFilter,
|
|
21
|
-
format: RGBAFormat,
|
|
22
|
-
depthTexture: selectDepthTexture,
|
|
23
|
-
anisotropy: 16,
|
|
24
|
-
});
|
|
25
|
-
// 深度测试后的选中纹理
|
|
26
|
-
const selectDethpTestTextureTarget = new WebGLRenderTarget(512, 512, {
|
|
27
|
-
minFilter: LinearFilter,
|
|
28
|
-
magFilter: LinearFilter,
|
|
29
|
-
format: RGBAFormat,
|
|
30
|
-
anisotropy: 16,
|
|
31
|
-
});
|
|
32
|
-
// 由于不能同时读写自己的纹理
|
|
33
|
-
const blur1TextureTarget = new WebGLRenderTarget(512, 512, { minFilter: LinearFilter, magFilter: LinearFilter, format: RGBAFormat });
|
|
34
|
-
// 所以需要用2个模糊纹理相互读写
|
|
35
|
-
const blur2TextureTarget = new WebGLRenderTarget(512, 512, { minFilter: LinearFilter, magFilter: LinearFilter, format: RGBAFormat });
|
|
36
|
-
const size = new Vector2();
|
|
37
|
-
// 创建一个渲染工具 用于处理纹理
|
|
38
|
-
const fsQuad = new FullScreenQuad(); // 渲染辅助器
|
|
39
|
-
//深度比对纹理
|
|
40
|
-
const depthTestShader = new ShaderMaterial({
|
|
41
|
-
uniforms: {
|
|
42
|
-
map: { value: null },
|
|
43
|
-
baseDepth: { value: null },
|
|
44
|
-
selectDepth: { value: null }, // 选中的对象深度纹理
|
|
45
|
-
},
|
|
1
|
+
/*
|
|
2
|
+
* @Author: xiaosihan
|
|
3
|
+
* @Date: 2023-05-09 00:35:17
|
|
4
|
+
* @Last Modified by: xiaosihan
|
|
5
|
+
* @Last Modified time: 2023-05-09 02:33:28
|
|
6
|
+
*/
|
|
7
|
+
import { LinearFilter, RGBAFormat, Vector2, WebGLRenderTarget, ShaderMaterial, NoBlending, Scene, RawShaderMaterial, Color, NormalBlending, ShaderChunk, DepthTexture, DepthFormat, UnsignedShortType } from "three";
|
|
8
|
+
import FullScreenQuad from "./FullScreenQuad";
|
|
9
|
+
// 选中对象的深度纹理
|
|
10
|
+
const selectDepthTexture = (() => {
|
|
11
|
+
const baseDepthTexture = new DepthTexture(4096, 4096);
|
|
12
|
+
baseDepthTexture.format = DepthFormat;
|
|
13
|
+
baseDepthTexture.type = UnsignedShortType;
|
|
14
|
+
baseDepthTexture.anisotropy = 16;
|
|
15
|
+
return baseDepthTexture;
|
|
16
|
+
})();
|
|
17
|
+
// 选中对象的纹理
|
|
18
|
+
const selectTextureTarget = new WebGLRenderTarget(512, 512, {
|
|
19
|
+
minFilter: LinearFilter,
|
|
20
|
+
magFilter: LinearFilter,
|
|
21
|
+
format: RGBAFormat,
|
|
22
|
+
depthTexture: selectDepthTexture,
|
|
23
|
+
anisotropy: 16,
|
|
24
|
+
});
|
|
25
|
+
// 深度测试后的选中纹理
|
|
26
|
+
const selectDethpTestTextureTarget = new WebGLRenderTarget(512, 512, {
|
|
27
|
+
minFilter: LinearFilter,
|
|
28
|
+
magFilter: LinearFilter,
|
|
29
|
+
format: RGBAFormat,
|
|
30
|
+
anisotropy: 16,
|
|
31
|
+
});
|
|
32
|
+
// 由于不能同时读写自己的纹理
|
|
33
|
+
const blur1TextureTarget = new WebGLRenderTarget(512, 512, { minFilter: LinearFilter, magFilter: LinearFilter, format: RGBAFormat });
|
|
34
|
+
// 所以需要用2个模糊纹理相互读写
|
|
35
|
+
const blur2TextureTarget = new WebGLRenderTarget(512, 512, { minFilter: LinearFilter, magFilter: LinearFilter, format: RGBAFormat });
|
|
36
|
+
const size = new Vector2();
|
|
37
|
+
// 创建一个渲染工具 用于处理纹理
|
|
38
|
+
const fsQuad = new FullScreenQuad(); // 渲染辅助器
|
|
39
|
+
//深度比对纹理
|
|
40
|
+
const depthTestShader = new ShaderMaterial({
|
|
41
|
+
uniforms: {
|
|
42
|
+
map: { value: null },
|
|
43
|
+
baseDepth: { value: null },
|
|
44
|
+
selectDepth: { value: null }, // 选中的对象深度纹理
|
|
45
|
+
},
|
|
46
46
|
vertexShader: `
|
|
47
47
|
${ShaderChunk.common}
|
|
48
48
|
${ShaderChunk.logdepthbuf_pars_vertex}
|
|
@@ -54,7 +54,7 @@ const depthTestShader = new ShaderMaterial({
|
|
|
54
54
|
gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );
|
|
55
55
|
${ShaderChunk.logdepthbuf_vertex}
|
|
56
56
|
}
|
|
57
|
-
`,
|
|
57
|
+
`,
|
|
58
58
|
fragmentShader: `
|
|
59
59
|
${ShaderChunk.logdepthbuf_pars_fragment}
|
|
60
60
|
uniform sampler2D map;
|
|
@@ -68,18 +68,18 @@ const depthTestShader = new ShaderMaterial({
|
|
|
68
68
|
gl_FragColor = texture2D(map, vUv);
|
|
69
69
|
${ShaderChunk.logdepthbuf_fragment}
|
|
70
70
|
}
|
|
71
|
-
`,
|
|
72
|
-
blending: NoBlending,
|
|
73
|
-
depthTest: true,
|
|
74
|
-
depthWrite: true,
|
|
75
|
-
transparent: true
|
|
76
|
-
});
|
|
77
|
-
// 抗锯齿着色器
|
|
78
|
-
const FXAAShaderMaterial = new ShaderMaterial({
|
|
79
|
-
uniforms: {
|
|
80
|
-
tDiffuse: { value: null },
|
|
81
|
-
resolution: { value: new Vector2(1 / 1024, 1 / 1024) }
|
|
82
|
-
},
|
|
71
|
+
`,
|
|
72
|
+
blending: NoBlending,
|
|
73
|
+
depthTest: true,
|
|
74
|
+
depthWrite: true,
|
|
75
|
+
transparent: true
|
|
76
|
+
});
|
|
77
|
+
// 抗锯齿着色器
|
|
78
|
+
const FXAAShaderMaterial = new ShaderMaterial({
|
|
79
|
+
uniforms: {
|
|
80
|
+
tDiffuse: { value: null },
|
|
81
|
+
resolution: { value: new Vector2(1 / 1024, 1 / 1024) }
|
|
82
|
+
},
|
|
83
83
|
vertexShader: `
|
|
84
84
|
${ShaderChunk.common}
|
|
85
85
|
${ShaderChunk.logdepthbuf_pars_vertex}
|
|
@@ -89,7 +89,7 @@ const FXAAShaderMaterial = new ShaderMaterial({
|
|
|
89
89
|
gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );
|
|
90
90
|
${ShaderChunk.logdepthbuf_vertex}
|
|
91
91
|
}
|
|
92
|
-
`,
|
|
92
|
+
`,
|
|
93
93
|
fragmentShader: `
|
|
94
94
|
${ShaderChunk.logdepthbuf_pars_fragment}
|
|
95
95
|
precision highp float;
|
|
@@ -304,49 +304,49 @@ const FXAAShaderMaterial = new ShaderMaterial({
|
|
|
304
304
|
);
|
|
305
305
|
${ShaderChunk.logdepthbuf_fragment}
|
|
306
306
|
}
|
|
307
|
-
`,
|
|
308
|
-
blending: NoBlending,
|
|
309
|
-
depthTest: false,
|
|
310
|
-
depthWrite: false,
|
|
311
|
-
transparent: true
|
|
312
|
-
});
|
|
313
|
-
// 描边着色器
|
|
314
|
-
const blurShader = new RawShaderMaterial({
|
|
315
|
-
uniforms: {
|
|
316
|
-
tDiffuse: { value: null },
|
|
317
|
-
color: { value: new Color("#0f0") },
|
|
318
|
-
width: { value: 1.0 },
|
|
319
|
-
opacity: { value: 1.0 },
|
|
320
|
-
resolution: { value: new Vector2(1 / 512, 1 / 512) },
|
|
321
|
-
offset: {
|
|
322
|
-
value: [
|
|
323
|
-
new Vector2(0.000, 1.000),
|
|
324
|
-
new Vector2(0.259, 0.966),
|
|
325
|
-
new Vector2(0.500, 0.866),
|
|
326
|
-
new Vector2(0.707, 0.707),
|
|
327
|
-
new Vector2(0.866, 0.500),
|
|
328
|
-
new Vector2(0.966, 0.259),
|
|
329
|
-
new Vector2(1.000, 0.000),
|
|
330
|
-
new Vector2(0.966, -0.259),
|
|
331
|
-
new Vector2(0.866, -0.500),
|
|
332
|
-
new Vector2(0.707, -0.707),
|
|
333
|
-
new Vector2(0.500, -0.866),
|
|
334
|
-
new Vector2(0.259, -0.966),
|
|
335
|
-
new Vector2(0.000, -1.000),
|
|
336
|
-
new Vector2(-0.259, -0.966),
|
|
337
|
-
new Vector2(-0.500, -0.866),
|
|
338
|
-
new Vector2(-0.707, -0.707),
|
|
339
|
-
new Vector2(-0.866, -0.500),
|
|
340
|
-
new Vector2(-0.966, -0.259),
|
|
341
|
-
new Vector2(-1.000, -0.000),
|
|
342
|
-
new Vector2(-0.966, 0.259),
|
|
343
|
-
new Vector2(-0.866, 0.500),
|
|
344
|
-
new Vector2(-0.707, 0.707),
|
|
345
|
-
new Vector2(-0.500, 0.866),
|
|
346
|
-
new Vector2(-0.259, 0.966)
|
|
347
|
-
]
|
|
348
|
-
}
|
|
349
|
-
},
|
|
307
|
+
`,
|
|
308
|
+
blending: NoBlending,
|
|
309
|
+
depthTest: false,
|
|
310
|
+
depthWrite: false,
|
|
311
|
+
transparent: true
|
|
312
|
+
});
|
|
313
|
+
// 描边着色器
|
|
314
|
+
const blurShader = new RawShaderMaterial({
|
|
315
|
+
uniforms: {
|
|
316
|
+
tDiffuse: { value: null },
|
|
317
|
+
color: { value: new Color("#0f0") },
|
|
318
|
+
width: { value: 1.0 },
|
|
319
|
+
opacity: { value: 1.0 },
|
|
320
|
+
resolution: { value: new Vector2(1 / 512, 1 / 512) },
|
|
321
|
+
offset: {
|
|
322
|
+
value: [
|
|
323
|
+
new Vector2(0.000, 1.000),
|
|
324
|
+
new Vector2(0.259, 0.966),
|
|
325
|
+
new Vector2(0.500, 0.866),
|
|
326
|
+
new Vector2(0.707, 0.707),
|
|
327
|
+
new Vector2(0.866, 0.500),
|
|
328
|
+
new Vector2(0.966, 0.259),
|
|
329
|
+
new Vector2(1.000, 0.000),
|
|
330
|
+
new Vector2(0.966, -0.259),
|
|
331
|
+
new Vector2(0.866, -0.500),
|
|
332
|
+
new Vector2(0.707, -0.707),
|
|
333
|
+
new Vector2(0.500, -0.866),
|
|
334
|
+
new Vector2(0.259, -0.966),
|
|
335
|
+
new Vector2(0.000, -1.000),
|
|
336
|
+
new Vector2(-0.259, -0.966),
|
|
337
|
+
new Vector2(-0.500, -0.866),
|
|
338
|
+
new Vector2(-0.707, -0.707),
|
|
339
|
+
new Vector2(-0.866, -0.500),
|
|
340
|
+
new Vector2(-0.966, -0.259),
|
|
341
|
+
new Vector2(-1.000, -0.000),
|
|
342
|
+
new Vector2(-0.966, 0.259),
|
|
343
|
+
new Vector2(-0.866, 0.500),
|
|
344
|
+
new Vector2(-0.707, 0.707),
|
|
345
|
+
new Vector2(-0.500, 0.866),
|
|
346
|
+
new Vector2(-0.259, 0.966)
|
|
347
|
+
]
|
|
348
|
+
}
|
|
349
|
+
},
|
|
350
350
|
vertexShader: `
|
|
351
351
|
attribute vec3 position;
|
|
352
352
|
attribute vec2 uv;
|
|
@@ -354,7 +354,7 @@ const blurShader = new RawShaderMaterial({
|
|
|
354
354
|
void main() {
|
|
355
355
|
vUv = uv;
|
|
356
356
|
gl_Position = vec4(position, 1.0);
|
|
357
|
-
}`,
|
|
357
|
+
}`,
|
|
358
358
|
fragmentShader: `
|
|
359
359
|
#ifdef GL_ES
|
|
360
360
|
precision highp float;
|
|
@@ -391,19 +391,19 @@ const blurShader = new RawShaderMaterial({
|
|
|
391
391
|
} else {
|
|
392
392
|
gl_FragColor = stroke();
|
|
393
393
|
}
|
|
394
|
-
}`,
|
|
395
|
-
blending: NoBlending,
|
|
396
|
-
depthTest: false,
|
|
397
|
-
depthWrite: false,
|
|
398
|
-
transparent: true
|
|
399
|
-
});
|
|
400
|
-
// 过滤着色器
|
|
401
|
-
const filterSelectShader = new RawShaderMaterial({
|
|
402
|
-
uniforms: {
|
|
403
|
-
selectTexture: { value: null },
|
|
404
|
-
blurTexture: { value: null },
|
|
405
|
-
opacity: { value: 1 },
|
|
406
|
-
},
|
|
394
|
+
}`,
|
|
395
|
+
blending: NoBlending,
|
|
396
|
+
depthTest: false,
|
|
397
|
+
depthWrite: false,
|
|
398
|
+
transparent: true
|
|
399
|
+
});
|
|
400
|
+
// 过滤着色器
|
|
401
|
+
const filterSelectShader = new RawShaderMaterial({
|
|
402
|
+
uniforms: {
|
|
403
|
+
selectTexture: { value: null },
|
|
404
|
+
blurTexture: { value: null },
|
|
405
|
+
opacity: { value: 1 },
|
|
406
|
+
},
|
|
407
407
|
vertexShader: `
|
|
408
408
|
attribute vec3 position;
|
|
409
409
|
attribute vec2 uv;
|
|
@@ -412,7 +412,7 @@ const filterSelectShader = new RawShaderMaterial({
|
|
|
412
412
|
vUv = uv;
|
|
413
413
|
gl_Position = vec4(position, 1.0);
|
|
414
414
|
}
|
|
415
|
-
`,
|
|
415
|
+
`,
|
|
416
416
|
fragmentShader: `
|
|
417
417
|
#ifdef GL_ES
|
|
418
418
|
precision highp float;
|
|
@@ -427,16 +427,16 @@ const filterSelectShader = new RawShaderMaterial({
|
|
|
427
427
|
gl_FragColor.a -= (texture2D(selectTexture, vUv).a);
|
|
428
428
|
gl_FragColor.a *= opacity;
|
|
429
429
|
}
|
|
430
|
-
`,
|
|
431
|
-
blending: NoBlending,
|
|
432
|
-
depthTest: false,
|
|
433
|
-
depthWrite: false,
|
|
434
|
-
transparent: true
|
|
435
|
-
});
|
|
436
|
-
const copyShader = new ShaderMaterial({
|
|
437
|
-
uniforms: {
|
|
438
|
-
map: { value: null }, // 贴图纹理
|
|
439
|
-
},
|
|
430
|
+
`,
|
|
431
|
+
blending: NoBlending,
|
|
432
|
+
depthTest: false,
|
|
433
|
+
depthWrite: false,
|
|
434
|
+
transparent: true
|
|
435
|
+
});
|
|
436
|
+
const copyShader = new ShaderMaterial({
|
|
437
|
+
uniforms: {
|
|
438
|
+
map: { value: null }, // 贴图纹理
|
|
439
|
+
},
|
|
440
440
|
vertexShader: `
|
|
441
441
|
${ShaderChunk.common}
|
|
442
442
|
${ShaderChunk.logdepthbuf_pars_vertex}
|
|
@@ -448,7 +448,7 @@ const copyShader = new ShaderMaterial({
|
|
|
448
448
|
gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );
|
|
449
449
|
${ShaderChunk.logdepthbuf_vertex}
|
|
450
450
|
}
|
|
451
|
-
`,
|
|
451
|
+
`,
|
|
452
452
|
fragmentShader: `
|
|
453
453
|
${ShaderChunk.logdepthbuf_pars_fragment}
|
|
454
454
|
uniform sampler2D map;
|
|
@@ -457,111 +457,111 @@ const copyShader = new ShaderMaterial({
|
|
|
457
457
|
gl_FragColor = texture2D(map, vUv);
|
|
458
458
|
${ShaderChunk.logdepthbuf_fragment}
|
|
459
459
|
}
|
|
460
|
-
`,
|
|
461
|
-
depthTest: true,
|
|
462
|
-
depthWrite: true,
|
|
463
|
-
transparent: true
|
|
464
|
-
});
|
|
465
|
-
// 场景对象
|
|
466
|
-
const scene = new Scene();
|
|
467
|
-
// 对象发光
|
|
468
|
-
export default function glow_pass(renderer, camera, object3d, baseDepthTexture) {
|
|
469
|
-
const { glow_enable = false, glow_color = "#04fa12", glow_width = 1, glow_opacity = 1 } = object3d.userData;
|
|
470
|
-
if (!glow_enable || glow_width === 0) {
|
|
471
|
-
return;
|
|
472
|
-
}
|
|
473
|
-
// 保存原帧缓冲区
|
|
474
|
-
const originRenderTarget = renderer.getRenderTarget();
|
|
475
|
-
// 设置选中目标的帧缓冲区
|
|
476
|
-
renderer.getSize(size);
|
|
477
|
-
size.multiplyScalar(window.devicePixelRatio);
|
|
478
|
-
selectTextureTarget.setSize(size.x, size.y);
|
|
479
|
-
selectDethpTestTextureTarget.setSize(size.x, size.y);
|
|
480
|
-
blur1TextureTarget.setSize(size.x, size.y);
|
|
481
|
-
blur2TextureTarget.setSize(size.x, size.y);
|
|
482
|
-
renderer.setRenderTarget(selectTextureTarget);
|
|
483
|
-
scene.children = [object3d];
|
|
484
|
-
renderer.clear();
|
|
485
|
-
renderer.render(scene, camera);
|
|
486
|
-
// 设置描边着色器的分辨率
|
|
487
|
-
blurShader.uniforms.resolution.value.set(1 / size.x, 1 / size.y);
|
|
488
|
-
// 设置抗锯齿着色器的分辨率
|
|
489
|
-
FXAAShaderMaterial.uniforms.resolution.value.set(1 / size.x, 1 / size.y);
|
|
490
|
-
//描边颜色
|
|
491
|
-
blurShader.uniforms.color.value.set(glow_color);
|
|
492
|
-
blurShader.uniforms.width.value = glow_width / 10;
|
|
493
|
-
//深度测试
|
|
494
|
-
renderer.setRenderTarget(selectDethpTestTextureTarget);
|
|
495
|
-
renderer.clear();
|
|
496
|
-
depthTestShader.uniforms.map.value = selectTextureTarget.texture;
|
|
497
|
-
depthTestShader.uniforms.baseDepth.value = baseDepthTexture;
|
|
498
|
-
depthTestShader.uniforms.selectDepth.value = selectDepthTexture;
|
|
499
|
-
fsQuad.render(renderer, depthTestShader);
|
|
500
|
-
//一次描边
|
|
501
|
-
renderer.setRenderTarget(blur1TextureTarget);
|
|
502
|
-
blurShader.uniforms.tDiffuse.value = selectDethpTestTextureTarget.texture;
|
|
503
|
-
blurShader.uniforms.opacity.value = 1.0;
|
|
504
|
-
fsQuad.render(renderer, blurShader);
|
|
505
|
-
//二次描边
|
|
506
|
-
renderer.setRenderTarget(blur2TextureTarget);
|
|
507
|
-
blurShader.uniforms.tDiffuse.value = blur1TextureTarget.texture;
|
|
508
|
-
blurShader.uniforms.opacity.value = 0.9;
|
|
509
|
-
fsQuad.render(renderer, blurShader);
|
|
510
|
-
//三次描边
|
|
511
|
-
renderer.setRenderTarget(blur1TextureTarget);
|
|
512
|
-
blurShader.uniforms.tDiffuse.value = blur2TextureTarget.texture;
|
|
513
|
-
blurShader.uniforms.opacity.value = 0.8;
|
|
514
|
-
fsQuad.render(renderer, blurShader);
|
|
515
|
-
//四次描边
|
|
516
|
-
renderer.setRenderTarget(blur2TextureTarget);
|
|
517
|
-
blurShader.uniforms.tDiffuse.value = blur1TextureTarget.texture;
|
|
518
|
-
blurShader.uniforms.opacity.value = 0.7;
|
|
519
|
-
fsQuad.render(renderer, blurShader);
|
|
520
|
-
//五次描边
|
|
521
|
-
renderer.setRenderTarget(blur1TextureTarget);
|
|
522
|
-
blurShader.uniforms.tDiffuse.value = blur2TextureTarget.texture;
|
|
523
|
-
blurShader.uniforms.opacity.value = 0.6;
|
|
524
|
-
fsQuad.render(renderer, blurShader);
|
|
525
|
-
//六次描边
|
|
526
|
-
renderer.setRenderTarget(blur2TextureTarget);
|
|
527
|
-
blurShader.uniforms.tDiffuse.value = blur1TextureTarget.texture;
|
|
528
|
-
blurShader.uniforms.opacity.value = 0.5;
|
|
529
|
-
fsQuad.render(renderer, blurShader);
|
|
530
|
-
//七次描边
|
|
531
|
-
renderer.setRenderTarget(blur1TextureTarget);
|
|
532
|
-
blurShader.uniforms.tDiffuse.value = blur2TextureTarget.texture;
|
|
533
|
-
blurShader.uniforms.opacity.value = 0.4;
|
|
534
|
-
fsQuad.render(renderer, blurShader);
|
|
535
|
-
//八次描边
|
|
536
|
-
renderer.setRenderTarget(blur2TextureTarget);
|
|
537
|
-
blurShader.uniforms.tDiffuse.value = blur1TextureTarget.texture;
|
|
538
|
-
blurShader.uniforms.opacity.value = 0.3;
|
|
539
|
-
fsQuad.render(renderer, blurShader);
|
|
540
|
-
//九次描边
|
|
541
|
-
renderer.setRenderTarget(blur1TextureTarget);
|
|
542
|
-
blurShader.uniforms.tDiffuse.value = blur2TextureTarget.texture;
|
|
543
|
-
blurShader.uniforms.opacity.value = 0.2;
|
|
544
|
-
fsQuad.render(renderer, blurShader);
|
|
545
|
-
//十次描边
|
|
546
|
-
renderer.setRenderTarget(blur2TextureTarget);
|
|
547
|
-
blurShader.uniforms.tDiffuse.value = blur1TextureTarget.texture;
|
|
548
|
-
blurShader.uniforms.opacity.value = 0.1;
|
|
549
|
-
fsQuad.render(renderer, blurShader);
|
|
550
|
-
//最后抗锯齿
|
|
551
|
-
renderer.setRenderTarget(blur1TextureTarget);
|
|
552
|
-
FXAAShaderMaterial.uniforms.tDiffuse.value = blur2TextureTarget.texture;
|
|
553
|
-
fsQuad.render(renderer, FXAAShaderMaterial);
|
|
554
|
-
// 还原帧缓冲区 减去原始纹理保留描边
|
|
555
|
-
renderer.setRenderTarget(originRenderTarget);
|
|
556
|
-
filterSelectShader.uniforms.selectTexture.value = selectDethpTestTextureTarget.texture;
|
|
557
|
-
filterSelectShader.uniforms.blurTexture.value = blur1TextureTarget.texture;
|
|
558
|
-
filterSelectShader.uniforms.opacity.value = glow_opacity;
|
|
559
|
-
filterSelectShader.blending = NormalBlending; // 与有的纹理融合计算 保留前面通道传递下来的纹理
|
|
560
|
-
fsQuad.render(renderer, filterSelectShader);
|
|
561
|
-
// 调试代码
|
|
562
|
-
// renderer.setRenderTarget(null);
|
|
563
|
-
// renderer.clearDepth();
|
|
564
|
-
// copyShader.uniforms.tDiffuse.value = blur2TextureTarget.texture;
|
|
565
|
-
// fsQuad.render(renderer, copyShader);
|
|
566
|
-
// return;
|
|
567
|
-
}
|
|
460
|
+
`,
|
|
461
|
+
depthTest: true,
|
|
462
|
+
depthWrite: true,
|
|
463
|
+
transparent: true
|
|
464
|
+
});
|
|
465
|
+
// 场景对象
|
|
466
|
+
const scene = new Scene();
|
|
467
|
+
// 对象发光
|
|
468
|
+
export default function glow_pass(renderer, camera, object3d, baseDepthTexture) {
|
|
469
|
+
const { glow_enable = false, glow_color = "#04fa12", glow_width = 1, glow_opacity = 1 } = object3d.userData;
|
|
470
|
+
if (!glow_enable || glow_width === 0) {
|
|
471
|
+
return;
|
|
472
|
+
}
|
|
473
|
+
// 保存原帧缓冲区
|
|
474
|
+
const originRenderTarget = renderer.getRenderTarget();
|
|
475
|
+
// 设置选中目标的帧缓冲区
|
|
476
|
+
renderer.getSize(size);
|
|
477
|
+
size.multiplyScalar(window.devicePixelRatio);
|
|
478
|
+
selectTextureTarget.setSize(size.x, size.y);
|
|
479
|
+
selectDethpTestTextureTarget.setSize(size.x, size.y);
|
|
480
|
+
blur1TextureTarget.setSize(size.x, size.y);
|
|
481
|
+
blur2TextureTarget.setSize(size.x, size.y);
|
|
482
|
+
renderer.setRenderTarget(selectTextureTarget);
|
|
483
|
+
scene.children = [object3d];
|
|
484
|
+
renderer.clear();
|
|
485
|
+
renderer.render(scene, camera);
|
|
486
|
+
// 设置描边着色器的分辨率
|
|
487
|
+
blurShader.uniforms.resolution.value.set(1 / size.x, 1 / size.y);
|
|
488
|
+
// 设置抗锯齿着色器的分辨率
|
|
489
|
+
FXAAShaderMaterial.uniforms.resolution.value.set(1 / size.x, 1 / size.y);
|
|
490
|
+
//描边颜色
|
|
491
|
+
blurShader.uniforms.color.value.set(glow_color);
|
|
492
|
+
blurShader.uniforms.width.value = glow_width / 10;
|
|
493
|
+
//深度测试
|
|
494
|
+
renderer.setRenderTarget(selectDethpTestTextureTarget);
|
|
495
|
+
renderer.clear();
|
|
496
|
+
depthTestShader.uniforms.map.value = selectTextureTarget.texture;
|
|
497
|
+
depthTestShader.uniforms.baseDepth.value = baseDepthTexture;
|
|
498
|
+
depthTestShader.uniforms.selectDepth.value = selectDepthTexture;
|
|
499
|
+
fsQuad.render(renderer, depthTestShader);
|
|
500
|
+
//一次描边
|
|
501
|
+
renderer.setRenderTarget(blur1TextureTarget);
|
|
502
|
+
blurShader.uniforms.tDiffuse.value = selectDethpTestTextureTarget.texture;
|
|
503
|
+
blurShader.uniforms.opacity.value = 1.0;
|
|
504
|
+
fsQuad.render(renderer, blurShader);
|
|
505
|
+
//二次描边
|
|
506
|
+
renderer.setRenderTarget(blur2TextureTarget);
|
|
507
|
+
blurShader.uniforms.tDiffuse.value = blur1TextureTarget.texture;
|
|
508
|
+
blurShader.uniforms.opacity.value = 0.9;
|
|
509
|
+
fsQuad.render(renderer, blurShader);
|
|
510
|
+
//三次描边
|
|
511
|
+
renderer.setRenderTarget(blur1TextureTarget);
|
|
512
|
+
blurShader.uniforms.tDiffuse.value = blur2TextureTarget.texture;
|
|
513
|
+
blurShader.uniforms.opacity.value = 0.8;
|
|
514
|
+
fsQuad.render(renderer, blurShader);
|
|
515
|
+
//四次描边
|
|
516
|
+
renderer.setRenderTarget(blur2TextureTarget);
|
|
517
|
+
blurShader.uniforms.tDiffuse.value = blur1TextureTarget.texture;
|
|
518
|
+
blurShader.uniforms.opacity.value = 0.7;
|
|
519
|
+
fsQuad.render(renderer, blurShader);
|
|
520
|
+
//五次描边
|
|
521
|
+
renderer.setRenderTarget(blur1TextureTarget);
|
|
522
|
+
blurShader.uniforms.tDiffuse.value = blur2TextureTarget.texture;
|
|
523
|
+
blurShader.uniforms.opacity.value = 0.6;
|
|
524
|
+
fsQuad.render(renderer, blurShader);
|
|
525
|
+
//六次描边
|
|
526
|
+
renderer.setRenderTarget(blur2TextureTarget);
|
|
527
|
+
blurShader.uniforms.tDiffuse.value = blur1TextureTarget.texture;
|
|
528
|
+
blurShader.uniforms.opacity.value = 0.5;
|
|
529
|
+
fsQuad.render(renderer, blurShader);
|
|
530
|
+
//七次描边
|
|
531
|
+
renderer.setRenderTarget(blur1TextureTarget);
|
|
532
|
+
blurShader.uniforms.tDiffuse.value = blur2TextureTarget.texture;
|
|
533
|
+
blurShader.uniforms.opacity.value = 0.4;
|
|
534
|
+
fsQuad.render(renderer, blurShader);
|
|
535
|
+
//八次描边
|
|
536
|
+
renderer.setRenderTarget(blur2TextureTarget);
|
|
537
|
+
blurShader.uniforms.tDiffuse.value = blur1TextureTarget.texture;
|
|
538
|
+
blurShader.uniforms.opacity.value = 0.3;
|
|
539
|
+
fsQuad.render(renderer, blurShader);
|
|
540
|
+
//九次描边
|
|
541
|
+
renderer.setRenderTarget(blur1TextureTarget);
|
|
542
|
+
blurShader.uniforms.tDiffuse.value = blur2TextureTarget.texture;
|
|
543
|
+
blurShader.uniforms.opacity.value = 0.2;
|
|
544
|
+
fsQuad.render(renderer, blurShader);
|
|
545
|
+
//十次描边
|
|
546
|
+
renderer.setRenderTarget(blur2TextureTarget);
|
|
547
|
+
blurShader.uniforms.tDiffuse.value = blur1TextureTarget.texture;
|
|
548
|
+
blurShader.uniforms.opacity.value = 0.1;
|
|
549
|
+
fsQuad.render(renderer, blurShader);
|
|
550
|
+
//最后抗锯齿
|
|
551
|
+
renderer.setRenderTarget(blur1TextureTarget);
|
|
552
|
+
FXAAShaderMaterial.uniforms.tDiffuse.value = blur2TextureTarget.texture;
|
|
553
|
+
fsQuad.render(renderer, FXAAShaderMaterial);
|
|
554
|
+
// 还原帧缓冲区 减去原始纹理保留描边
|
|
555
|
+
renderer.setRenderTarget(originRenderTarget);
|
|
556
|
+
filterSelectShader.uniforms.selectTexture.value = selectDethpTestTextureTarget.texture;
|
|
557
|
+
filterSelectShader.uniforms.blurTexture.value = blur1TextureTarget.texture;
|
|
558
|
+
filterSelectShader.uniforms.opacity.value = glow_opacity;
|
|
559
|
+
filterSelectShader.blending = NormalBlending; // 与有的纹理融合计算 保留前面通道传递下来的纹理
|
|
560
|
+
fsQuad.render(renderer, filterSelectShader);
|
|
561
|
+
// 调试代码
|
|
562
|
+
// renderer.setRenderTarget(null);
|
|
563
|
+
// renderer.clearDepth();
|
|
564
|
+
// copyShader.uniforms.tDiffuse.value = blur2TextureTarget.texture;
|
|
565
|
+
// fsQuad.render(renderer, copyShader);
|
|
566
|
+
// return;
|
|
567
|
+
}
|
package/pass/stroke_pass.d.ts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { Camera, Object3D, WebGLRenderer, DepthTexture } from "three";
|
|
2
|
-
export default function stroke_pass(renderer: WebGLRenderer, camera: Camera, object3d: Object3D, baseDepthTexture: DepthTexture): void;
|
|
1
|
+
import { Camera, Object3D, WebGLRenderer, DepthTexture } from "three";
|
|
2
|
+
export default function stroke_pass(renderer: WebGLRenderer, camera: Camera, object3d: Object3D, baseDepthTexture: DepthTexture): void;
|