three-base 2.0.130 → 2.0.137
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/DirectionalLight.d.ts +6 -0
- package/DirectionalLight.js +68 -0
- package/EventMesh.d.ts +18 -18
- package/EventMesh.js +59 -59
- package/ExtrudeMesh.d.ts +112 -112
- package/ExtrudeMesh.js +366 -366
- package/FPScontrol.d.ts +78 -50
- package/FPScontrol.js +617 -232
- 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/Fire/index.d.ts +1 -1
- package/Fire/index.js +1 -1
- package/Grass/Grass.d.ts +8 -8
- package/Grass/Grass.js +38 -38
- package/Grass/index.d.ts +1 -1
- package/Grass/index.js +1 -1
- package/Ground1/Ground1.d.ts +11 -11
- package/Ground1/Ground1.js +54 -54
- package/Ground1/index.d.ts +1 -1
- package/Ground1/index.js +1 -1
- package/InstancedMeshBase.d.ts +39 -39
- package/InstancedMeshBase.js +293 -293
- package/KeyFrameAnimation.d.ts +25 -25
- package/KeyFrameAnimation.js +78 -78
- package/MeshBase.d.ts +35 -35
- package/MeshBase.js +223 -223
- package/Mirror.d.ts +25 -25
- package/Mirror.js +139 -139
- package/PipeMesh/PathGeometry.d.ts +44 -44
- package/PipeMesh/PathGeometry.js +300 -300
- package/PipeMesh/PathPoint.d.ts +17 -17
- package/PipeMesh/PathPoint.js +31 -31
- package/PipeMesh/PathPointList.d.ts +31 -31
- package/PipeMesh/PathPointList.js +208 -208
- package/PipeMesh/PathTubeGeometry.d.ts +25 -25
- package/PipeMesh/PathTubeGeometry.js +130 -130
- package/PipeMesh/PipeMesh.d.ts +25 -25
- package/PipeMesh/PipeMesh.js +63 -63
- package/PipeMesh/index.d.ts +1 -1
- package/PipeMesh/index.js +1 -1
- 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 +39 -39
- package/PlaneText.js +30 -30
- package/PlaneWithHtml.d.ts +11 -11
- package/PlaneWithHtml.js +63 -68
- package/PointLight/PointLight.d.ts +14 -13
- package/PointLight/PointLight.js +70 -64
- package/PointLight/index.d.ts +1 -1
- package/PointLight/index.js +1 -1
- package/Sky/Sky.d.ts +9 -9
- package/Sky/Sky.js +22 -22
- package/Sky/index.d.ts +1 -1
- package/Sky/index.js +1 -1
- package/SpotLight.d.ts +6 -0
- package/SpotLight.js +72 -0
- 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 +44 -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 +199 -199
- package/Text3D/index.d.ts +1 -1
- package/Text3D/index.js +1 -1
- package/ThreeBase.d.ts +111 -81
- package/ThreeBase.js +656 -560
- package/ThreeMouse.d.ts +40 -40
- package/ThreeMouse.js +407 -407
- package/Transition.d.ts +40 -40
- package/Transition.js +210 -210
- package/Water/Water.d.ts +5 -0
- package/Water/Water.js +26 -0
- package/Water/waternormals.jpg +0 -0
- package/declare.d.ts +167 -0
- 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 +3 -2
- package/pass/bloom_pass.d.ts +2 -2
- package/pass/bloom_pass.js +99 -99
- package/pass/cover_pass.d.ts +2 -2
- package/pass/cover_pass.js +95 -95
- package/pass/emissive_ao_pass.d.ts +13 -0
- package/pass/emissive_ao_pass.js +370 -0
- package/pass/frosted_glass_pass.d.ts +2 -0
- package/pass/frosted_glass_pass.js +275 -0
- package/pass/fsQuad.d.ts +9 -9
- package/pass/fsQuad.js +28 -28
- package/pass/glow_pass.d.ts +2 -2
- package/pass/glow_pass.js +310 -254
- package/pass/ssao_pass.d.ts +13 -0
- package/pass/ssao_pass.js +372 -0
- package/pass/stroke_pass.d.ts +2 -2
- package/pass/stroke_pass.js +199 -199
- package/shaders/FXAAShaderMaterial.d.ts +3 -3
- package/shaders/FXAAShaderMaterial.js +21 -21
- package/shaders/baseTextureToRenderShader.d.ts +2 -2
- package/shaders/baseTextureToRenderShader.js +14 -14
- package/shaders/copyShader.d.ts +3 -3
- package/shaders/copyShader.js +14 -14
- package/shaders.d.ts +5 -5
- package/shaders.js +42 -42
- package/threeLoader.d.ts +34 -34
- package/threeLoader.js +527 -527
- package/threeUtils.d.ts +52 -52
- package/threeUtils.js +330 -330
package/pass/glow_pass.js
CHANGED
|
@@ -1,54 +1,54 @@
|
|
|
1
|
-
/*
|
|
2
|
-
* @Author: xiaosihan
|
|
3
|
-
* @Date: 2023-05-09 00:35:17
|
|
4
|
-
* @Last Modified by: xiaosihan
|
|
5
|
-
* @Last Modified time: 2025-01-28 04:13:16
|
|
6
|
-
*/
|
|
7
|
-
import { Color, DepthFormat, DepthTexture, LinearFilter, NoBlending, NormalBlending, RGBAFormat, RawShaderMaterial, Scene, ShaderChunk, ShaderMaterial, UnsignedShortType, Vector2, WebGLRenderTarget, } from "three";
|
|
8
|
-
import fsQuad from "./fsQuad";
|
|
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, {
|
|
34
|
-
minFilter: LinearFilter,
|
|
35
|
-
magFilter: LinearFilter,
|
|
36
|
-
format: RGBAFormat,
|
|
37
|
-
});
|
|
38
|
-
// 所以需要用2个模糊纹理相互读写
|
|
39
|
-
const blur2TextureTarget = new WebGLRenderTarget(512, 512, {
|
|
40
|
-
minFilter: LinearFilter,
|
|
41
|
-
magFilter: LinearFilter,
|
|
42
|
-
format: RGBAFormat,
|
|
43
|
-
});
|
|
44
|
-
const size = new Vector2();
|
|
45
|
-
//深度比对纹理
|
|
46
|
-
const depthTestShader = new ShaderMaterial({
|
|
47
|
-
uniforms: {
|
|
48
|
-
map: { value: null },
|
|
49
|
-
baseDepth: { value: null },
|
|
50
|
-
selectDepth: { value: null }, // 选中的对象深度纹理
|
|
51
|
-
},
|
|
1
|
+
/*
|
|
2
|
+
* @Author: xiaosihan
|
|
3
|
+
* @Date: 2023-05-09 00:35:17
|
|
4
|
+
* @Last Modified by: xiaosihan
|
|
5
|
+
* @Last Modified time: 2025-01-28 04:13:16
|
|
6
|
+
*/
|
|
7
|
+
import { Color, DepthFormat, DepthTexture, LinearFilter, NoBlending, NormalBlending, RGBAFormat, RawShaderMaterial, Scene, ShaderChunk, ShaderMaterial, UnsignedShortType, Vector2, WebGLRenderTarget, } from "three";
|
|
8
|
+
import fsQuad from "./fsQuad";
|
|
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, {
|
|
34
|
+
minFilter: LinearFilter,
|
|
35
|
+
magFilter: LinearFilter,
|
|
36
|
+
format: RGBAFormat,
|
|
37
|
+
});
|
|
38
|
+
// 所以需要用2个模糊纹理相互读写
|
|
39
|
+
const blur2TextureTarget = new WebGLRenderTarget(512, 512, {
|
|
40
|
+
minFilter: LinearFilter,
|
|
41
|
+
magFilter: LinearFilter,
|
|
42
|
+
format: RGBAFormat,
|
|
43
|
+
});
|
|
44
|
+
const size = new Vector2();
|
|
45
|
+
//深度比对纹理
|
|
46
|
+
const depthTestShader = new ShaderMaterial({
|
|
47
|
+
uniforms: {
|
|
48
|
+
map: { value: null }, // 贴图纹理
|
|
49
|
+
baseDepth: { value: null }, // 整个场景的深度纹理
|
|
50
|
+
selectDepth: { value: null }, // 选中的对象深度纹理
|
|
51
|
+
},
|
|
52
52
|
vertexShader: `
|
|
53
53
|
${ShaderChunk.common}
|
|
54
54
|
${ShaderChunk.logdepthbuf_pars_vertex}
|
|
@@ -58,7 +58,7 @@ const depthTestShader = new ShaderMaterial({
|
|
|
58
58
|
gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );
|
|
59
59
|
${ShaderChunk.logdepthbuf_vertex}
|
|
60
60
|
}
|
|
61
|
-
`,
|
|
61
|
+
`,
|
|
62
62
|
fragmentShader: `
|
|
63
63
|
${ShaderChunk.logdepthbuf_pars_fragment}
|
|
64
64
|
uniform sampler2D map;
|
|
@@ -75,49 +75,20 @@ const depthTestShader = new ShaderMaterial({
|
|
|
75
75
|
gl_FragColor = texture2D(map, vUv);
|
|
76
76
|
${ShaderChunk.logdepthbuf_fragment}
|
|
77
77
|
}
|
|
78
|
-
`,
|
|
79
|
-
blending: NoBlending,
|
|
80
|
-
depthTest: true,
|
|
81
|
-
depthWrite: true,
|
|
82
|
-
transparent: true,
|
|
83
|
-
});
|
|
84
|
-
//
|
|
85
|
-
const
|
|
86
|
-
uniforms: {
|
|
87
|
-
tDiffuse: { value: null },
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
offset: {
|
|
93
|
-
value: [
|
|
94
|
-
new Vector2(0.0, 1.0),
|
|
95
|
-
new Vector2(0.259, 0.966),
|
|
96
|
-
new Vector2(0.5, 0.866),
|
|
97
|
-
new Vector2(0.707, 0.707),
|
|
98
|
-
new Vector2(0.866, 0.5),
|
|
99
|
-
new Vector2(0.966, 0.259),
|
|
100
|
-
new Vector2(1.0, 0.0),
|
|
101
|
-
new Vector2(0.966, -0.259),
|
|
102
|
-
new Vector2(0.866, -0.5),
|
|
103
|
-
new Vector2(0.707, -0.707),
|
|
104
|
-
new Vector2(0.5, -0.866),
|
|
105
|
-
new Vector2(0.259, -0.966),
|
|
106
|
-
new Vector2(0.0, -1.0),
|
|
107
|
-
new Vector2(-0.259, -0.966),
|
|
108
|
-
new Vector2(-0.5, -0.866),
|
|
109
|
-
new Vector2(-0.707, -0.707),
|
|
110
|
-
new Vector2(-0.866, -0.5),
|
|
111
|
-
new Vector2(-0.966, -0.259),
|
|
112
|
-
new Vector2(-1.0, -0.0),
|
|
113
|
-
new Vector2(-0.966, 0.259),
|
|
114
|
-
new Vector2(-0.866, 0.5),
|
|
115
|
-
new Vector2(-0.707, 0.707),
|
|
116
|
-
new Vector2(-0.5, 0.866),
|
|
117
|
-
new Vector2(-0.259, 0.966),
|
|
118
|
-
],
|
|
119
|
-
},
|
|
120
|
-
},
|
|
78
|
+
`,
|
|
79
|
+
blending: NoBlending, // 渲染时不与背景融合计算 直接替换
|
|
80
|
+
depthTest: true,
|
|
81
|
+
depthWrite: true,
|
|
82
|
+
transparent: true,
|
|
83
|
+
});
|
|
84
|
+
// 高斯模糊着色器 - 水平方向
|
|
85
|
+
const gaussianBlurHShader = new RawShaderMaterial({
|
|
86
|
+
uniforms: {
|
|
87
|
+
tDiffuse: { value: null },
|
|
88
|
+
resolution: { value: new Vector2(1 / 512, 1 / 512) },
|
|
89
|
+
radius: { value: 1.0 },
|
|
90
|
+
sigma: { value: 1.0 },
|
|
91
|
+
},
|
|
121
92
|
vertexShader: `
|
|
122
93
|
attribute vec3 position;
|
|
123
94
|
attribute vec2 uv;
|
|
@@ -125,56 +96,146 @@ const blurShader = new RawShaderMaterial({
|
|
|
125
96
|
void main() {
|
|
126
97
|
vUv = uv;
|
|
127
98
|
gl_Position = vec4(position, 1.0);
|
|
128
|
-
}`,
|
|
99
|
+
}`,
|
|
129
100
|
fragmentShader: `
|
|
130
101
|
#ifdef GL_ES
|
|
131
102
|
precision highp float;
|
|
132
103
|
#endif
|
|
133
104
|
uniform sampler2D tDiffuse;
|
|
134
|
-
uniform vec3 color;
|
|
135
|
-
uniform float width;
|
|
136
|
-
uniform float opacity;
|
|
137
105
|
uniform vec2 resolution;
|
|
138
|
-
uniform
|
|
106
|
+
uniform float radius;
|
|
107
|
+
uniform float sigma;
|
|
139
108
|
varying vec2 vUv;
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
109
|
+
|
|
110
|
+
// 高斯函数
|
|
111
|
+
float gaussian(float x, float sigma) {
|
|
112
|
+
return exp(-(x * x) / (2.0 * sigma * sigma));
|
|
113
|
+
}
|
|
114
|
+
|
|
115
|
+
void main() {
|
|
116
|
+
vec4 color = vec4(0.0);
|
|
117
|
+
float totalWeight = 0.0;
|
|
118
|
+
|
|
119
|
+
// 计算高斯权重
|
|
120
|
+
for (int i = -10; i <= 10; i++) {
|
|
121
|
+
float x = float(i);
|
|
122
|
+
float weight = gaussian(x, sigma);
|
|
123
|
+
vec2 offset = vec2(x * radius * resolution.x, 0.0);
|
|
124
|
+
color += texture2D(tDiffuse, vUv + offset) * weight;
|
|
125
|
+
totalWeight += weight;
|
|
156
126
|
}
|
|
127
|
+
|
|
128
|
+
gl_FragColor = color / totalWeight;
|
|
129
|
+
}`,
|
|
130
|
+
blending: NoBlending,
|
|
131
|
+
depthTest: false,
|
|
132
|
+
depthWrite: false,
|
|
133
|
+
transparent: true,
|
|
134
|
+
});
|
|
135
|
+
// 高斯模糊着色器 - 垂直方向
|
|
136
|
+
const gaussianBlurVShader = new RawShaderMaterial({
|
|
137
|
+
uniforms: {
|
|
138
|
+
tDiffuse: { value: null },
|
|
139
|
+
resolution: { value: new Vector2(1 / 512, 1 / 512) },
|
|
140
|
+
radius: { value: 1.0 },
|
|
141
|
+
sigma: { value: 1.0 },
|
|
142
|
+
},
|
|
143
|
+
vertexShader: `
|
|
144
|
+
attribute vec3 position;
|
|
145
|
+
attribute vec2 uv;
|
|
146
|
+
varying vec2 vUv;
|
|
147
|
+
void main() {
|
|
148
|
+
vUv = uv;
|
|
149
|
+
gl_Position = vec4(position, 1.0);
|
|
150
|
+
}`,
|
|
151
|
+
fragmentShader: `
|
|
152
|
+
#ifdef GL_ES
|
|
153
|
+
precision highp float;
|
|
154
|
+
#endif
|
|
155
|
+
uniform sampler2D tDiffuse;
|
|
156
|
+
uniform vec2 resolution;
|
|
157
|
+
uniform float radius;
|
|
158
|
+
uniform float sigma;
|
|
159
|
+
varying vec2 vUv;
|
|
160
|
+
|
|
161
|
+
// 高斯函数
|
|
162
|
+
float gaussian(float x, float sigma) {
|
|
163
|
+
return exp(-(x * x) / (2.0 * sigma * sigma));
|
|
157
164
|
}
|
|
165
|
+
|
|
166
|
+
void main() {
|
|
167
|
+
vec4 color = vec4(0.0);
|
|
168
|
+
float totalWeight = 0.0;
|
|
169
|
+
|
|
170
|
+
// 计算高斯权重
|
|
171
|
+
for (int i = -10; i <= 10; i++) {
|
|
172
|
+
float y = float(i);
|
|
173
|
+
float weight = gaussian(y, sigma);
|
|
174
|
+
vec2 offset = vec2(0.0, y * radius * resolution.y);
|
|
175
|
+
color += texture2D(tDiffuse, vUv + offset) * weight;
|
|
176
|
+
totalWeight += weight;
|
|
177
|
+
}
|
|
178
|
+
|
|
179
|
+
gl_FragColor = color / totalWeight;
|
|
180
|
+
}`,
|
|
181
|
+
blending: NoBlending,
|
|
182
|
+
depthTest: false,
|
|
183
|
+
depthWrite: false,
|
|
184
|
+
transparent: true,
|
|
185
|
+
});
|
|
186
|
+
// 发光合成着色器
|
|
187
|
+
const glowCompositeShader = new RawShaderMaterial({
|
|
188
|
+
uniforms: {
|
|
189
|
+
tDiffuse: { value: null },
|
|
190
|
+
color: { value: new Color("#0f0") },
|
|
191
|
+
opacity: { value: 1.0 },
|
|
192
|
+
threshold: { value: 0.0 },
|
|
193
|
+
},
|
|
194
|
+
vertexShader: `
|
|
195
|
+
attribute vec3 position;
|
|
196
|
+
attribute vec2 uv;
|
|
197
|
+
varying vec2 vUv;
|
|
198
|
+
void main() {
|
|
199
|
+
vUv = uv;
|
|
200
|
+
gl_Position = vec4(position, 1.0);
|
|
201
|
+
}`,
|
|
202
|
+
fragmentShader: `
|
|
203
|
+
#ifdef GL_ES
|
|
204
|
+
precision highp float;
|
|
205
|
+
#endif
|
|
206
|
+
uniform sampler2D tDiffuse;
|
|
207
|
+
uniform vec3 color;
|
|
208
|
+
uniform float opacity;
|
|
209
|
+
uniform float threshold;
|
|
210
|
+
varying vec2 vUv;
|
|
211
|
+
|
|
158
212
|
void main() {
|
|
159
|
-
vec4
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
213
|
+
vec4 texColor = texture2D(tDiffuse, vUv);
|
|
214
|
+
float alpha = texColor.a;
|
|
215
|
+
|
|
216
|
+
// 应用阈值
|
|
217
|
+
if (alpha < threshold) {
|
|
218
|
+
gl_FragColor = vec4(0.0);
|
|
219
|
+
return;
|
|
164
220
|
}
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
}
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
221
|
+
|
|
222
|
+
// 增强alpha值,确保发光效果明显
|
|
223
|
+
alpha = min(1.0, alpha * 2.0);
|
|
224
|
+
|
|
225
|
+
gl_FragColor = vec4(color, alpha * opacity);
|
|
226
|
+
}`,
|
|
227
|
+
blending: NoBlending,
|
|
228
|
+
depthTest: false,
|
|
229
|
+
depthWrite: false,
|
|
230
|
+
transparent: true,
|
|
231
|
+
});
|
|
232
|
+
// 过滤着色器 - 修复alpha计算逻辑
|
|
233
|
+
const filterSelectShader = new RawShaderMaterial({
|
|
234
|
+
uniforms: {
|
|
235
|
+
selectTexture: { value: null },
|
|
236
|
+
blurTexture: { value: null },
|
|
237
|
+
opacity: { value: 1 },
|
|
238
|
+
},
|
|
178
239
|
vertexShader: `
|
|
179
240
|
attribute vec3 position;
|
|
180
241
|
attribute vec2 uv;
|
|
@@ -183,7 +244,7 @@ const filterSelectShader = new RawShaderMaterial({
|
|
|
183
244
|
vUv = uv;
|
|
184
245
|
gl_Position = vec4(position, 1.0);
|
|
185
246
|
}
|
|
186
|
-
`,
|
|
247
|
+
`,
|
|
187
248
|
fragmentShader: `
|
|
188
249
|
#ifdef GL_ES
|
|
189
250
|
precision highp float;
|
|
@@ -194,20 +255,30 @@ const filterSelectShader = new RawShaderMaterial({
|
|
|
194
255
|
varying vec2 vUv;
|
|
195
256
|
|
|
196
257
|
void main() {
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
258
|
+
// 获取模糊后的纹理和原始纹理
|
|
259
|
+
vec4 blurColor = texture2D(blurTexture, vUv);
|
|
260
|
+
vec4 selectColor = texture2D(selectTexture, vUv);
|
|
261
|
+
|
|
262
|
+
// 计算辉光部分:模糊纹理 - 原始纹理,确保alpha非负
|
|
263
|
+
vec4 glowColor = blurColor - selectColor;
|
|
264
|
+
glowColor.a = max(0.0, glowColor.a);
|
|
265
|
+
|
|
266
|
+
// 应用透明度
|
|
267
|
+
glowColor.a *= opacity;
|
|
268
|
+
|
|
269
|
+
// 设置最终颜色
|
|
270
|
+
gl_FragColor = glowColor;
|
|
200
271
|
}
|
|
201
|
-
`,
|
|
202
|
-
blending:
|
|
203
|
-
depthTest: false,
|
|
204
|
-
depthWrite: false,
|
|
205
|
-
transparent: true,
|
|
206
|
-
});
|
|
207
|
-
const copyShader = new ShaderMaterial({
|
|
208
|
-
uniforms: {
|
|
209
|
-
map: { value: null }, // 贴图纹理
|
|
210
|
-
},
|
|
272
|
+
`,
|
|
273
|
+
blending: NormalBlending, // 与现有纹理融合
|
|
274
|
+
depthTest: false,
|
|
275
|
+
depthWrite: false,
|
|
276
|
+
transparent: true,
|
|
277
|
+
});
|
|
278
|
+
const copyShader = new ShaderMaterial({
|
|
279
|
+
uniforms: {
|
|
280
|
+
map: { value: null }, // 贴图纹理
|
|
281
|
+
},
|
|
211
282
|
vertexShader: `
|
|
212
283
|
${ShaderChunk.common}
|
|
213
284
|
${ShaderChunk.logdepthbuf_pars_vertex}
|
|
@@ -219,7 +290,7 @@ const copyShader = new ShaderMaterial({
|
|
|
219
290
|
gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );
|
|
220
291
|
${ShaderChunk.logdepthbuf_vertex}
|
|
221
292
|
}
|
|
222
|
-
`,
|
|
293
|
+
`,
|
|
223
294
|
fragmentShader: `
|
|
224
295
|
${ShaderChunk.logdepthbuf_pars_fragment}
|
|
225
296
|
uniform sampler2D map;
|
|
@@ -228,108 +299,93 @@ const copyShader = new ShaderMaterial({
|
|
|
228
299
|
gl_FragColor = texture2D(map, vUv);
|
|
229
300
|
${ShaderChunk.logdepthbuf_fragment}
|
|
230
301
|
}
|
|
231
|
-
`,
|
|
232
|
-
depthTest: true,
|
|
233
|
-
depthWrite: true,
|
|
234
|
-
transparent: true,
|
|
235
|
-
});
|
|
236
|
-
// 场景对象
|
|
237
|
-
const scene = new Scene();
|
|
238
|
-
// 对象发光
|
|
239
|
-
export default function glow_pass(renderer, camera, object3d, baseDepthTexture, devicePixelRatio) {
|
|
240
|
-
const { glow_enable = false, glow_color = "#04fa12", glow_width = 1, glow_opacity = 1,
|
|
241
|
-
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
|
|
245
|
-
|
|
246
|
-
|
|
247
|
-
|
|
248
|
-
|
|
249
|
-
|
|
250
|
-
|
|
251
|
-
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
|
|
255
|
-
|
|
256
|
-
|
|
257
|
-
|
|
258
|
-
|
|
259
|
-
|
|
260
|
-
|
|
261
|
-
|
|
262
|
-
|
|
263
|
-
renderer.
|
|
264
|
-
|
|
265
|
-
depthTestShader.uniforms.
|
|
266
|
-
depthTestShader.uniforms.
|
|
267
|
-
|
|
268
|
-
|
|
269
|
-
|
|
270
|
-
|
|
271
|
-
|
|
272
|
-
|
|
273
|
-
|
|
274
|
-
|
|
275
|
-
|
|
276
|
-
|
|
277
|
-
|
|
278
|
-
|
|
279
|
-
|
|
280
|
-
|
|
281
|
-
|
|
282
|
-
|
|
283
|
-
|
|
284
|
-
|
|
285
|
-
|
|
286
|
-
|
|
287
|
-
|
|
288
|
-
|
|
289
|
-
|
|
290
|
-
|
|
291
|
-
|
|
292
|
-
|
|
293
|
-
|
|
294
|
-
|
|
295
|
-
|
|
296
|
-
|
|
297
|
-
|
|
298
|
-
|
|
299
|
-
|
|
300
|
-
renderer.setRenderTarget(blur1TextureTarget);
|
|
301
|
-
|
|
302
|
-
|
|
303
|
-
|
|
304
|
-
|
|
305
|
-
|
|
306
|
-
|
|
307
|
-
|
|
308
|
-
|
|
309
|
-
|
|
310
|
-
|
|
311
|
-
|
|
312
|
-
|
|
313
|
-
fsQuad.render(renderer,
|
|
314
|
-
|
|
315
|
-
renderer.setRenderTarget(
|
|
316
|
-
|
|
317
|
-
|
|
318
|
-
fsQuad.render(renderer,
|
|
319
|
-
|
|
320
|
-
|
|
321
|
-
fsQuad.render(renderer, copyShader);
|
|
322
|
-
// 还原帧缓冲区 减去原始纹理保留描边
|
|
323
|
-
renderer.setRenderTarget(originRenderTarget);
|
|
324
|
-
filterSelectShader.uniforms.selectTexture.value = selectDethpTestTextureTarget.texture;
|
|
325
|
-
filterSelectShader.uniforms.blurTexture.value = blur1TextureTarget.texture;
|
|
326
|
-
filterSelectShader.uniforms.opacity.value = glow_opacity;
|
|
327
|
-
filterSelectShader.blending = NormalBlending; // 与有的纹理融合计算 保留前面通道传递下来的纹理
|
|
328
|
-
fsQuad.render(renderer, filterSelectShader);
|
|
329
|
-
// 调试代码
|
|
330
|
-
// renderer.setRenderTarget(null);
|
|
331
|
-
// renderer.clearDepth();
|
|
332
|
-
// copyShader.uniforms.map.value = blur2TextureTarget.texture;
|
|
333
|
-
// fsQuad.render(renderer, copyShader);
|
|
334
|
-
// return;
|
|
335
|
-
}
|
|
302
|
+
`,
|
|
303
|
+
depthTest: true,
|
|
304
|
+
depthWrite: true,
|
|
305
|
+
transparent: true,
|
|
306
|
+
});
|
|
307
|
+
// 场景对象
|
|
308
|
+
const scene = new Scene();
|
|
309
|
+
// 对象发光
|
|
310
|
+
export default function glow_pass(renderer, camera, object3d, baseDepthTexture, devicePixelRatio) {
|
|
311
|
+
const { glow_enable = false, glow_color = "#04fa12", glow_width = 1, glow_opacity = 1, glow_sigma = 2.0, // 高斯模糊的标准差
|
|
312
|
+
glow_threshold = 0.0, // 发光阈值,默认0确保辉光显示
|
|
313
|
+
glow_iterations = 10, // 模糊迭代次数
|
|
314
|
+
} = object3d.userData;
|
|
315
|
+
if (!glow_enable || glow_width === 0) {
|
|
316
|
+
return;
|
|
317
|
+
}
|
|
318
|
+
// 保存原帧缓冲区
|
|
319
|
+
const originRenderTarget = renderer.getRenderTarget();
|
|
320
|
+
// 设置选中目标的帧缓冲区
|
|
321
|
+
renderer.getSize(size);
|
|
322
|
+
size.multiplyScalar(devicePixelRatio);
|
|
323
|
+
selectTextureTarget.setSize(size.x, size.y);
|
|
324
|
+
selectDethpTestTextureTarget.setSize(size.x, size.y);
|
|
325
|
+
blur1TextureTarget.setSize(size.x, size.y);
|
|
326
|
+
blur2TextureTarget.setSize(size.x, size.y);
|
|
327
|
+
// 1. 将对象渲染到临时纹理
|
|
328
|
+
renderer.setRenderTarget(selectTextureTarget);
|
|
329
|
+
scene.children = [object3d];
|
|
330
|
+
renderer.clear();
|
|
331
|
+
renderer.render(scene, camera);
|
|
332
|
+
// 2. 使用深度纹理提取选中的对象未被遮挡的像素点
|
|
333
|
+
renderer.setRenderTarget(selectDethpTestTextureTarget);
|
|
334
|
+
renderer.clear();
|
|
335
|
+
depthTestShader.uniforms.map.value = selectTextureTarget.texture;
|
|
336
|
+
depthTestShader.uniforms.baseDepth.value = baseDepthTexture;
|
|
337
|
+
depthTestShader.uniforms.selectDepth.value = selectDepthTexture;
|
|
338
|
+
fsQuad.render(renderer, depthTestShader);
|
|
339
|
+
// 3. 设置高斯模糊参数
|
|
340
|
+
const blurRadius = glow_width * 2.0; // 增加模糊半径,使辉光更明显
|
|
341
|
+
gaussianBlurHShader.uniforms.resolution.value.set(1 / size.x, 1 / size.y);
|
|
342
|
+
gaussianBlurVShader.uniforms.resolution.value.set(1 / size.x, 1 / size.y);
|
|
343
|
+
gaussianBlurHShader.uniforms.radius.value = blurRadius;
|
|
344
|
+
gaussianBlurVShader.uniforms.radius.value = blurRadius;
|
|
345
|
+
gaussianBlurHShader.uniforms.sigma.value = glow_sigma;
|
|
346
|
+
gaussianBlurVShader.uniforms.sigma.value = glow_sigma;
|
|
347
|
+
// 4. 执行高斯模糊 - 简化逻辑,确保可靠性
|
|
348
|
+
// 第一次模糊
|
|
349
|
+
renderer.setRenderTarget(blur1TextureTarget);
|
|
350
|
+
renderer.clear();
|
|
351
|
+
gaussianBlurHShader.uniforms.tDiffuse.value = selectDethpTestTextureTarget.texture;
|
|
352
|
+
fsQuad.render(renderer, gaussianBlurHShader);
|
|
353
|
+
renderer.setRenderTarget(blur2TextureTarget);
|
|
354
|
+
renderer.clear();
|
|
355
|
+
gaussianBlurVShader.uniforms.tDiffuse.value = blur1TextureTarget.texture;
|
|
356
|
+
fsQuad.render(renderer, gaussianBlurVShader);
|
|
357
|
+
// 如果需要多次迭代,继续模糊
|
|
358
|
+
if (glow_iterations > 1) {
|
|
359
|
+
for (let i = 1; i < glow_iterations; i++) {
|
|
360
|
+
renderer.setRenderTarget(blur1TextureTarget);
|
|
361
|
+
renderer.clear();
|
|
362
|
+
gaussianBlurHShader.uniforms.tDiffuse.value = blur2TextureTarget.texture;
|
|
363
|
+
fsQuad.render(renderer, gaussianBlurHShader);
|
|
364
|
+
renderer.setRenderTarget(blur2TextureTarget);
|
|
365
|
+
renderer.clear();
|
|
366
|
+
gaussianBlurVShader.uniforms.tDiffuse.value = blur1TextureTarget.texture;
|
|
367
|
+
fsQuad.render(renderer, gaussianBlurVShader);
|
|
368
|
+
}
|
|
369
|
+
}
|
|
370
|
+
// 5. 发光合成 - 使用最终的模糊结果
|
|
371
|
+
renderer.setRenderTarget(blur1TextureTarget);
|
|
372
|
+
renderer.clear();
|
|
373
|
+
glowCompositeShader.uniforms.tDiffuse.value = blur2TextureTarget.texture;
|
|
374
|
+
glowCompositeShader.uniforms.color.value.set(glow_color);
|
|
375
|
+
glowCompositeShader.uniforms.opacity.value = 1.0;
|
|
376
|
+
glowCompositeShader.uniforms.threshold.value = glow_threshold;
|
|
377
|
+
fsQuad.render(renderer, glowCompositeShader);
|
|
378
|
+
// 6. 还原帧缓冲区 减去原始纹理保留发光部分
|
|
379
|
+
renderer.setRenderTarget(originRenderTarget);
|
|
380
|
+
filterSelectShader.uniforms.selectTexture.value = selectDethpTestTextureTarget.texture;
|
|
381
|
+
filterSelectShader.uniforms.blurTexture.value = blur1TextureTarget.texture;
|
|
382
|
+
filterSelectShader.uniforms.opacity.value = glow_opacity;
|
|
383
|
+
filterSelectShader.blending = NormalBlending; // 与有的纹理融合计算 保留前面通道传递下来的纹理
|
|
384
|
+
fsQuad.render(renderer, filterSelectShader);
|
|
385
|
+
// 调试代码
|
|
386
|
+
// renderer.setRenderTarget(null);
|
|
387
|
+
// renderer.clearDepth();
|
|
388
|
+
// copyShader.uniforms.map.value = blur1TextureTarget.texture;
|
|
389
|
+
// fsQuad.render(renderer, copyShader);
|
|
390
|
+
// return;
|
|
391
|
+
}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { Camera, DepthTexture, WebGLRenderer } from "three";
|
|
2
|
+
export default function ssao_pass(renderer: WebGLRenderer, camera: Camera, depthTexture: DepthTexture, devicePixelRatio: number, options: {
|
|
3
|
+
enable: boolean;
|
|
4
|
+
debug?: boolean;
|
|
5
|
+
radius?: number;
|
|
6
|
+
falloff?: number;
|
|
7
|
+
bias?: number;
|
|
8
|
+
intensity?: number;
|
|
9
|
+
sampleCount?: number;
|
|
10
|
+
blurRadius?: number;
|
|
11
|
+
strength?: number;
|
|
12
|
+
cameraFar?: number;
|
|
13
|
+
}): void;
|