three-base 2.0.142 → 2.0.166

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.
Files changed (231) hide show
  1. package/DirectionalLight.d.ts +6 -6
  2. package/DirectionalLight.js +68 -68
  3. package/EventMap.d.ts +103 -103
  4. package/EventMap.js +17 -17
  5. package/EventMesh.d.ts +18 -18
  6. package/EventMesh.js +59 -59
  7. package/ExtrudeMesh.d.ts +112 -112
  8. package/ExtrudeMesh.js +342 -342
  9. package/FPScontrol.d.ts +531 -511
  10. package/FPScontrol.js +1866 -1799
  11. package/FPScontrol.ts +1922 -1855
  12. package/Fire/Fire.d.ts +28 -28
  13. package/Fire/Fire.js +80 -80
  14. package/Fire/FireGeometry.d.ts +9 -9
  15. package/Fire/FireGeometry.js +40 -40
  16. package/Fire/FireMaterial.d.ts +28 -28
  17. package/Fire/FireMaterial.js +32 -32
  18. package/Fire/index.d.ts +2 -2
  19. package/Fire/index.js +2 -2
  20. package/GLTFDracoLoader.d.ts +71 -71
  21. package/GLTFDracoLoader.js +266 -266
  22. package/GLTFDracoLoader.ts +1 -1
  23. package/Grass/Grass.d.ts +8 -8
  24. package/Grass/Grass.js +38 -38
  25. package/Grass/index.d.ts +2 -2
  26. package/Grass/index.js +2 -2
  27. package/Ground1/Ground1.d.ts +10 -10
  28. package/Ground1/Ground1.js +71 -71
  29. package/Ground1/index.d.ts +1 -1
  30. package/Ground1/index.js +1 -1
  31. package/MeshBase.d.ts +36 -36
  32. package/MeshBase.js +251 -247
  33. package/MeshBase.ts +6 -2
  34. package/Mirror.d.ts +25 -25
  35. package/Mirror.js +143 -143
  36. package/MktMesh/MktMesh.d.ts +301 -291
  37. package/MktMesh/MktMesh.js +1064 -1045
  38. package/MktMesh/MktMesh.ts +32 -11
  39. package/MktMesh/assetUrl.d.ts +59 -35
  40. package/MktMesh/assetUrl.js +165 -69
  41. package/MktMesh/assetUrl.ts +164 -69
  42. package/MktMesh/mktMappingShader.d.ts +12 -12
  43. package/MktMesh/mktMappingShader.js +138 -138
  44. package/MktMesh/mktMappingShader.ts +139 -139
  45. package/MktMesh/mktShader.d.ts +263 -263
  46. package/MktMesh/mktShader.js +1236 -1236
  47. package/MktMesh/mktShader.ts +1344 -1344
  48. package/MktMesh/panoBitmapTexture.d.ts +25 -25
  49. package/MktMesh/panoBitmapTexture.js +52 -52
  50. package/MktMesh/panoBitmapTexture.ts +54 -54
  51. package/MktMesh/panoSlotBind.d.ts +29 -29
  52. package/MktMesh/panoSlotBind.js +106 -106
  53. package/MktMesh/panoSlotBind.ts +153 -153
  54. package/MktMesh/panoSlotRoster.d.ts +22 -22
  55. package/MktMesh/panoSlotRoster.js +169 -169
  56. package/MktMesh/panoSlotRoster.ts +168 -168
  57. package/MktMesh/panoTileStitcher.d.ts +119 -119
  58. package/MktMesh/panoTileStitcher.js +529 -529
  59. package/MktMesh/panoTileStitcher.ts +616 -616
  60. package/MktMesh/types.d.ts +75 -75
  61. package/MktMesh/types.js +1 -1
  62. package/MktMesh/wallCapTessellate.d.ts +33 -33
  63. package/MktMesh/wallCapTessellate.js +97 -97
  64. package/MktMesh/wallCapTessellate.ts +68 -68
  65. package/PipeMesh/PathGeometry.d.ts +44 -44
  66. package/PipeMesh/PathGeometry.js +307 -307
  67. package/PipeMesh/PathPoint.d.ts +17 -17
  68. package/PipeMesh/PathPoint.js +31 -31
  69. package/PipeMesh/PathPointList.d.ts +31 -31
  70. package/PipeMesh/PathPointList.js +209 -209
  71. package/PipeMesh/PathTubeGeometry.d.ts +25 -25
  72. package/PipeMesh/PathTubeGeometry.js +130 -130
  73. package/PipeMesh/PipeMesh.d.ts +25 -25
  74. package/PipeMesh/PipeMesh.js +63 -63
  75. package/PipeMesh/index.d.ts +1 -1
  76. package/PipeMesh/index.js +1 -1
  77. package/PlaneModal1/PlaneModal1.d.ts +34 -34
  78. package/PlaneModal1/PlaneModal1.js +109 -109
  79. package/PlaneModal1/index.d.ts +1 -1
  80. package/PlaneModal1/index.js +1 -1
  81. package/PlaneText.d.ts +27 -27
  82. package/PlaneText.js +35 -35
  83. package/PlaneWithHtml.d.ts +13 -13
  84. package/PlaneWithHtml.js +66 -64
  85. package/PlaneWithHtml.ts +3 -1
  86. package/PointLight/PointLight.d.ts +13 -13
  87. package/PointLight/PointLight.js +64 -64
  88. package/PointLight/index.d.ts +1 -1
  89. package/PointLight/index.js +1 -1
  90. package/Sky/Sky.d.ts +9 -9
  91. package/Sky/Sky.js +22 -22
  92. package/Sky/index.d.ts +1 -1
  93. package/Sky/index.js +1 -1
  94. package/SpotLight.d.ts +6 -6
  95. package/SpotLight.js +72 -72
  96. package/SpriteModal1/SpriteModal1.d.ts +33 -33
  97. package/SpriteModal1/SpriteModal1.js +116 -116
  98. package/SpriteModal1/index.d.ts +1 -1
  99. package/SpriteModal1/index.js +1 -1
  100. package/SpriteText.d.ts +46 -46
  101. package/SpriteText.js +176 -176
  102. package/SpriteText2.d.ts +48 -48
  103. package/SpriteText2.js +223 -223
  104. package/SpriteText3.d.ts +86 -86
  105. package/SpriteText3.js +517 -517
  106. package/SpriteText3.ts +599 -599
  107. package/SpriteWithHtml.d.ts +9 -9
  108. package/SpriteWithHtml.js +46 -44
  109. package/SpriteWithHtml.ts +3 -1
  110. package/Text3D/Text3D.d.ts +20 -20
  111. package/Text3D/Text3D.js +58 -58
  112. package/Text3D/fontController.d.ts +60 -60
  113. package/Text3D/fontController.js +166 -166
  114. package/Text3D/index.d.ts +1 -1
  115. package/Text3D/index.js +1 -1
  116. package/ThreeBase.d.ts +248 -248
  117. package/ThreeBase.js +1202 -1202
  118. package/ThreeBase.ts +1314 -1314
  119. package/ThreeMouse.d.ts +53 -54
  120. package/ThreeMouse.js +453 -453
  121. package/Transition.d.ts +45 -45
  122. package/Transition.js +209 -209
  123. package/Water/Water.d.ts +5 -5
  124. package/Water/Water.js +44 -44
  125. package/Water/index.d.ts +2 -2
  126. package/Water/index.js +2 -2
  127. package/WaterFlow/FloatingDuck.d.ts +88 -88
  128. package/WaterFlow/FloatingDuck.js +307 -307
  129. package/WaterFlow/FloatingDuck.ts +445 -445
  130. package/WaterFlow/GPUFluidSimulation.d.ts +56 -56
  131. package/WaterFlow/GPUFluidSimulation.js +781 -781
  132. package/WaterFlow/GPUFluidSimulation.ts +827 -827
  133. package/WaterFlow/ReservoirSystem.d.ts +106 -106
  134. package/WaterFlow/ReservoirSystem.js +611 -611
  135. package/WaterFlow/ReservoirSystem.ts +754 -754
  136. package/WaterFlow/SPHField.d.ts +35 -35
  137. package/WaterFlow/SPHField.js +203 -203
  138. package/WaterFlow/SPHField.ts +228 -228
  139. package/WaterFlow/ScreenSpaceFluidPass.d.ts +69 -69
  140. package/WaterFlow/ScreenSpaceFluidPass.js +728 -728
  141. package/WaterFlow/ScreenSpaceFluidPass.ts +789 -789
  142. package/WaterFlow/ShallowWaterSurface.d.ts +45 -45
  143. package/WaterFlow/ShallowWaterSurface.js +438 -438
  144. package/WaterFlow/ShallowWaterSurface.ts +510 -510
  145. package/WaterFlow/WaterFlow.d.ts +87 -87
  146. package/WaterFlow/WaterFlow.js +171 -171
  147. package/WaterFlow/WaterFlow.ts +219 -219
  148. package/WaterFlow/types.d.ts +161 -161
  149. package/WaterFlow/types.js +1 -1
  150. package/WaterFlow/types.ts +189 -189
  151. package/WaterFlow/waterFlowPass.d.ts +3 -3
  152. package/WaterFlow/waterFlowPass.js +20 -20
  153. package/WaterFlow/waterFlowPass.ts +40 -40
  154. package/collisionOBB.d.ts +42 -42
  155. package/collisionOBB.js +112 -112
  156. package/collisionOBB.ts +108 -108
  157. package/declare.d.ts +25 -25
  158. package/index.d.ts +1 -1
  159. package/index.js +1 -1
  160. package/instanced/InstancedBatch.d.ts +57 -57
  161. package/instanced/InstancedBatch.js +348 -348
  162. package/instanced/InstancedBatch.ts +406 -406
  163. package/instanced/InstancedChild.d.ts +174 -174
  164. package/instanced/InstancedChild.js +264 -264
  165. package/instanced/InstancedChild.ts +327 -327
  166. package/instanced/InstancedGroup.d.ts +43 -43
  167. package/instanced/InstancedGroup.js +126 -126
  168. package/instanced/InstancedGroup.ts +137 -137
  169. package/instanced/InstancedMeshBase.d.ts +38 -38
  170. package/instanced/InstancedMeshBase.js +282 -282
  171. package/instanced/InstancedTemplate.d.ts +46 -46
  172. package/instanced/InstancedTemplate.js +125 -125
  173. package/keyControls.d.ts +29 -30
  174. package/keyControls.js +101 -101
  175. package/lensflare/LensFlare.d.ts +39 -39
  176. package/lensflare/LensFlare.js +284 -284
  177. package/package.json +6 -1
  178. package/pass/bloom_pass.d.ts +2 -2
  179. package/pass/bloom_pass.js +174 -174
  180. package/pass/cover_pass.d.ts +2 -2
  181. package/pass/cover_pass.js +108 -108
  182. package/pass/debugDepthState.d.ts +20 -20
  183. package/pass/debugDepthState.js +9 -9
  184. package/pass/debugDepthState.ts +22 -22
  185. package/pass/depthTestBias.d.ts +12 -12
  186. package/pass/depthTestBias.js +12 -12
  187. package/pass/depthTestBias.ts +12 -12
  188. package/pass/effectUserData.d.ts +27 -27
  189. package/pass/effectUserData.js +1 -1
  190. package/pass/effectUserData.ts +46 -46
  191. package/pass/frosted_glass_pass.d.ts +2 -2
  192. package/pass/frosted_glass_pass.js +150 -150
  193. package/pass/fsQuad.d.ts +9 -9
  194. package/pass/fsQuad.js +28 -28
  195. package/pass/glow_pass.d.ts +2 -2
  196. package/pass/glow_pass.js +350 -350
  197. package/pass/screen_bloom_pass.d.ts +11 -11
  198. package/pass/screen_bloom_pass.js +136 -136
  199. package/pass/ssao_pass.d.ts +88 -88
  200. package/pass/ssao_pass.js +799 -799
  201. package/pass/ssao_pass.ts +918 -918
  202. package/pass/stroke_pass.d.ts +2 -2
  203. package/pass/stroke_pass.js +267 -267
  204. package/shaders/FXAAShaderMaterial.d.ts +3 -3
  205. package/shaders/FXAAShaderMaterial.js +20 -20
  206. package/shaders/baseDepthVisShader.d.ts +11 -11
  207. package/shaders/baseDepthVisShader.js +36 -36
  208. package/shaders/baseDepthVisShader.ts +36 -36
  209. package/shaders/baseTextureToRenderShader.d.ts +2 -2
  210. package/shaders/baseTextureToRenderShader.js +19 -19
  211. package/shaders/copyShader.d.ts +3 -3
  212. package/shaders/copyShader.js +13 -13
  213. package/shaders/debugDepthCompareShader.d.ts +14 -14
  214. package/shaders/debugDepthCompareShader.js +49 -49
  215. package/shaders/debugDepthCompareShader.ts +50 -50
  216. package/shaders/debugDepthJudgeShader.d.ts +18 -18
  217. package/shaders/debugDepthJudgeShader.js +52 -52
  218. package/shaders/debugDepthJudgeShader.ts +54 -54
  219. package/shaders/debugExcludedShader.d.ts +13 -13
  220. package/shaders/debugExcludedShader.js +46 -46
  221. package/shaders/debugExcludedShader.ts +48 -48
  222. package/spriteTextBg.d.ts +1 -1
  223. package/spriteTextBg.js +20 -20
  224. package/spriteTextBg.ts +20 -20
  225. package/threeLoader.d.ts +35 -35
  226. package/threeLoader.js +518 -518
  227. package/threeUtils.d.ts +71 -53
  228. package/threeUtils.js +363 -329
  229. package/threeUtils.ts +35 -0
  230. package/types.d.ts +2 -2
  231. package/types.js +6 -6
@@ -1,228 +1,228 @@
1
- import * as THREE from 'three';
2
- import type { SPHFieldOptions } from './types';
3
-
4
- function createFieldTarget(width: number, height: number): THREE.WebGLRenderTarget {
5
- const target = new THREE.WebGLRenderTarget(width, height, {
6
- count: 2,
7
- format: THREE.RGBAFormat,
8
- type: THREE.HalfFloatType,
9
- minFilter: THREE.LinearFilter,
10
- magFilter: THREE.LinearFilter,
11
- wrapS: THREE.ClampToEdgeWrapping,
12
- wrapT: THREE.ClampToEdgeWrapping,
13
- depthBuffer: false,
14
- stencilBuffer: false,
15
- });
16
- target.textures[0].name = 'SPHDensityField';
17
- target.textures[1].name = 'SPHMomentumField';
18
- return target;
19
- }
20
-
21
- function createSplatGeometry(size: number, sliceLayers: number[]): THREE.BufferGeometry {
22
- const particleCount = size * size;
23
- const vertexCount = particleCount * sliceLayers.length;
24
- const positions = new Float32Array(vertexCount * 3);
25
- const lookup = new Float32Array(vertexCount * 2);
26
- const sliceOffset = new Float32Array(vertexCount);
27
-
28
- let vertex = 0;
29
- for (let particle = 0; particle < particleCount; particle++) {
30
- const x = particle % size;
31
- const y = Math.floor(particle / size);
32
- for (const offset of sliceLayers) {
33
- lookup[vertex * 2] = (x + 0.5) / size;
34
- lookup[vertex * 2 + 1] = (y + 0.5) / size;
35
- sliceOffset[vertex] = offset;
36
- vertex++;
37
- }
38
- }
39
-
40
- const geometry = new THREE.BufferGeometry();
41
- geometry.setAttribute('position', new THREE.BufferAttribute(positions, 3));
42
- geometry.setAttribute('aLookup', new THREE.BufferAttribute(lookup, 2));
43
- geometry.setAttribute('aSliceOffset', new THREE.BufferAttribute(sliceOffset, 1));
44
- return geometry;
45
- }
46
-
47
- /**
48
- * SPH(光滑粒子流体)栅格场:把每个粒子的密度/动量 splat 进一张 3D 切片图集,
49
- * 供 GPUFluidSimulation 的 updateMaterial 采样(网格辅助 SPH 的「场」那一半)。
50
- */
51
- export class SPHField {
52
- readonly renderer: THREE.WebGLRenderer;
53
- readonly particleTextureSize: number;
54
- readonly particleCount: number;
55
- readonly grid: THREE.Vector3;
56
- readonly tiles: THREE.Vector2;
57
- readonly atlasSize: THREE.Vector2;
58
- readonly domainMin: THREE.Vector3;
59
- readonly domainMax: THREE.Vector3;
60
- readonly cellSize: THREE.Vector3;
61
- readonly gridDenominator: THREE.Vector3;
62
- readonly previousClearColor: THREE.Color;
63
- readonly kernelRadius: number;
64
- readonly sliceLayers: number[];
65
-
66
- readonly target: THREE.WebGLRenderTarget;
67
- readonly geometry: THREE.BufferGeometry;
68
- readonly scene: THREE.Scene;
69
- readonly camera: THREE.OrthographicCamera;
70
- readonly material: THREE.ShaderMaterial;
71
- readonly points: THREE.Points;
72
-
73
- constructor(
74
- renderer: THREE.WebGLRenderer,
75
- particleTextureSize: number,
76
- { mobile = false }: SPHFieldOptions = {},
77
- ) {
78
- this.renderer = renderer;
79
- this.particleTextureSize = particleTextureSize;
80
- this.particleCount = particleTextureSize * particleTextureSize;
81
- this.grid = new THREE.Vector3(mobile ? 48 : 64, mobile ? 30 : 36, mobile ? 20 : 28);
82
- this.tiles = new THREE.Vector2(mobile ? 5 : 7, 4);
83
- this.atlasSize = new THREE.Vector2(this.grid.x * this.tiles.x, this.grid.y * this.tiles.y);
84
- this.domainMin = new THREE.Vector3(0.2, -0.34, -1.55);
85
- this.domainMax = new THREE.Vector3(4.9, 1.92, 1.55);
86
- this.cellSize = new THREE.Vector3();
87
- this.gridDenominator = new THREE.Vector3(this.grid.x - 1, this.grid.y - 1, this.grid.z - 1);
88
- this.previousClearColor = new THREE.Color();
89
- this.kernelRadius = mobile ? 0.125 : 0.105;
90
- this.sliceLayers = mobile ? [0, 1] : [-1, 0, 1];
91
-
92
- this.target = createFieldTarget(this.atlasSize.x, this.atlasSize.y);
93
- this.geometry = createSplatGeometry(particleTextureSize, this.sliceLayers);
94
- this.geometry.setDrawRange(0, this.particleCount * this.sliceLayers.length);
95
- this.scene = new THREE.Scene();
96
- this.camera = new THREE.OrthographicCamera(-1, 1, 1, -1, 0, 1);
97
-
98
- this.material = new THREE.ShaderMaterial({
99
- glslVersion: THREE.GLSL3,
100
- uniforms: {
101
- uPosition: { value: null },
102
- uVelocity: { value: null },
103
- uDomainMin: { value: this.domainMin },
104
- uDomainMax: { value: this.domainMax },
105
- uGrid: { value: this.grid },
106
- uTiles: { value: this.tiles },
107
- uAtlasSize: { value: this.atlasSize },
108
- uKernelRadius: { value: this.kernelRadius },
109
- },
110
- vertexShader: /* glsl */`
111
- precision highp float;
112
- uniform sampler2D uPosition;
113
- uniform sampler2D uVelocity;
114
- uniform vec3 uDomainMin;
115
- uniform vec3 uDomainMax;
116
- uniform vec3 uGrid;
117
- uniform vec2 uTiles;
118
- uniform vec2 uAtlasSize;
119
- uniform float uKernelRadius;
120
- in vec2 aLookup;
121
- in float aSliceOffset;
122
- out vec3 vVelocity;
123
- out float vSliceDistance;
124
- out float vAlive;
125
-
126
- void main() {
127
- vec4 state = texture(uPosition, aLookup);
128
- vec3 velocity = texture(uVelocity, aLookup).xyz;
129
- vec3 normalizedPosition = (state.xyz - uDomainMin) / (uDomainMax - uDomainMin);
130
- float sliceCoordinate = normalizedPosition.z * (uGrid.z - 1.0);
131
- float slice = floor(sliceCoordinate) + aSliceOffset;
132
- bool inDomain = all(greaterThanEqual(normalizedPosition, vec3(0.0)))
133
- && all(lessThanEqual(normalizedPosition, vec3(1.0)));
134
- bool validSlice = slice >= 0.0 && slice < uGrid.z;
135
- vAlive = step(0.0, state.w) * float(inDomain && validSlice);
136
- vVelocity = velocity;
137
- float cellDepth = (uDomainMax.z - uDomainMin.z) / max(uGrid.z - 1.0, 1.0);
138
- vSliceDistance = (slice - sliceCoordinate) * cellDepth;
139
-
140
- vec2 tile = vec2(mod(slice, uTiles.x), floor(slice / uTiles.x));
141
- vec2 localCell = normalizedPosition.xy * (uGrid.xy - 1.0) + vec2(0.5);
142
- vec2 atlasUv = (tile * uGrid.xy + localCell) / uAtlasSize;
143
- gl_Position = vAlive > 0.5 ? vec4(atlasUv * 2.0 - 1.0, 0.0, 1.0) : vec4(2.0, 2.0, 2.0, 1.0);
144
- vec2 cellWorld = (uDomainMax.xy - uDomainMin.xy) / max(uGrid.xy - 1.0, vec2(1.0));
145
- gl_PointSize = 2.0 * uKernelRadius / max(min(cellWorld.x, cellWorld.y), 0.0001);
146
- }
147
- `,
148
- fragmentShader: /* glsl */`
149
- precision highp float;
150
- uniform float uKernelRadius;
151
- in vec3 vVelocity;
152
- in float vSliceDistance;
153
- in float vAlive;
154
- layout(location = 0) out vec4 outDensity;
155
- layout(location = 1) out vec4 outMomentum;
156
-
157
- void main() {
158
- if (vAlive < 0.5) discard;
159
- vec2 radial = gl_PointCoord * 2.0 - 1.0;
160
- float distanceSquared = dot(radial, radial)
161
- + (vSliceDistance * vSliceDistance) / max(uKernelRadius * uKernelRadius, 0.000001);
162
- if (distanceSquared >= 1.0) discard;
163
- float kernel = pow(1.0 - distanceSquared, 3.0);
164
- outDensity = vec4(kernel, 0.0, 0.0, kernel);
165
- outMomentum = vec4(vVelocity * kernel, kernel);
166
- }
167
- `,
168
- transparent: true,
169
- depthTest: false,
170
- depthWrite: false,
171
- blending: THREE.AdditiveBlending,
172
- toneMapped: false,
173
- });
174
-
175
- this.points = new THREE.Points(this.geometry, this.material);
176
- this.points.frustumCulled = false;
177
- this.scene.add(this.points);
178
- this.updateCellSize();
179
- }
180
-
181
- updateCellSize(): void {
182
- this.cellSize.copy(this.domainMax).sub(this.domainMin).divide(this.gridDenominator);
183
- }
184
-
185
- setDomain(minimum: THREE.Vector3, maximum: THREE.Vector3): void {
186
- this.domainMin.copy(minimum);
187
- this.domainMax.copy(maximum);
188
- this.updateCellSize();
189
- }
190
-
191
- setActiveCount(count: number): void {
192
- const activeCount = THREE.MathUtils.clamp(Math.floor(count), 1, this.particleCount);
193
- this.geometry.setDrawRange(0, activeCount * this.sliceLayers.length);
194
- }
195
-
196
- build(positionTexture: THREE.Texture, velocityTexture: THREE.Texture): void {
197
- this.material.uniforms.uPosition.value = positionTexture;
198
- this.material.uniforms.uVelocity.value = velocityTexture;
199
- const previousTarget = this.renderer.getRenderTarget();
200
- const previousColor = this.renderer.getClearColor(this.previousClearColor);
201
- const previousAlpha = this.renderer.getClearAlpha();
202
- const previousAutoClear = this.renderer.autoClear;
203
-
204
- this.renderer.autoClear = true;
205
- this.renderer.setClearColor(0x000000, 0);
206
- this.renderer.setRenderTarget(this.target);
207
- this.renderer.clear(true, false, false);
208
- this.renderer.render(this.scene, this.camera);
209
-
210
- this.renderer.setRenderTarget(previousTarget);
211
- this.renderer.setClearColor(previousColor, previousAlpha);
212
- this.renderer.autoClear = previousAutoClear;
213
- }
214
-
215
- get densityTexture(): THREE.Texture {
216
- return this.target.textures[0];
217
- }
218
-
219
- get momentumTexture(): THREE.Texture {
220
- return this.target.textures[1];
221
- }
222
-
223
- dispose(): void {
224
- this.target.dispose();
225
- this.geometry.dispose();
226
- this.material.dispose();
227
- }
228
- }
1
+ import * as THREE from 'three';
2
+ import type { SPHFieldOptions } from './types';
3
+
4
+ function createFieldTarget(width: number, height: number): THREE.WebGLRenderTarget {
5
+ const target = new THREE.WebGLRenderTarget(width, height, {
6
+ count: 2,
7
+ format: THREE.RGBAFormat,
8
+ type: THREE.HalfFloatType,
9
+ minFilter: THREE.LinearFilter,
10
+ magFilter: THREE.LinearFilter,
11
+ wrapS: THREE.ClampToEdgeWrapping,
12
+ wrapT: THREE.ClampToEdgeWrapping,
13
+ depthBuffer: false,
14
+ stencilBuffer: false,
15
+ });
16
+ target.textures[0].name = 'SPHDensityField';
17
+ target.textures[1].name = 'SPHMomentumField';
18
+ return target;
19
+ }
20
+
21
+ function createSplatGeometry(size: number, sliceLayers: number[]): THREE.BufferGeometry {
22
+ const particleCount = size * size;
23
+ const vertexCount = particleCount * sliceLayers.length;
24
+ const positions = new Float32Array(vertexCount * 3);
25
+ const lookup = new Float32Array(vertexCount * 2);
26
+ const sliceOffset = new Float32Array(vertexCount);
27
+
28
+ let vertex = 0;
29
+ for (let particle = 0; particle < particleCount; particle++) {
30
+ const x = particle % size;
31
+ const y = Math.floor(particle / size);
32
+ for (const offset of sliceLayers) {
33
+ lookup[vertex * 2] = (x + 0.5) / size;
34
+ lookup[vertex * 2 + 1] = (y + 0.5) / size;
35
+ sliceOffset[vertex] = offset;
36
+ vertex++;
37
+ }
38
+ }
39
+
40
+ const geometry = new THREE.BufferGeometry();
41
+ geometry.setAttribute('position', new THREE.BufferAttribute(positions, 3));
42
+ geometry.setAttribute('aLookup', new THREE.BufferAttribute(lookup, 2));
43
+ geometry.setAttribute('aSliceOffset', new THREE.BufferAttribute(sliceOffset, 1));
44
+ return geometry;
45
+ }
46
+
47
+ /**
48
+ * SPH(光滑粒子流体)栅格场:把每个粒子的密度/动量 splat 进一张 3D 切片图集,
49
+ * 供 GPUFluidSimulation 的 updateMaterial 采样(网格辅助 SPH 的「场」那一半)。
50
+ */
51
+ export class SPHField {
52
+ readonly renderer: THREE.WebGLRenderer;
53
+ readonly particleTextureSize: number;
54
+ readonly particleCount: number;
55
+ readonly grid: THREE.Vector3;
56
+ readonly tiles: THREE.Vector2;
57
+ readonly atlasSize: THREE.Vector2;
58
+ readonly domainMin: THREE.Vector3;
59
+ readonly domainMax: THREE.Vector3;
60
+ readonly cellSize: THREE.Vector3;
61
+ readonly gridDenominator: THREE.Vector3;
62
+ readonly previousClearColor: THREE.Color;
63
+ readonly kernelRadius: number;
64
+ readonly sliceLayers: number[];
65
+
66
+ readonly target: THREE.WebGLRenderTarget;
67
+ readonly geometry: THREE.BufferGeometry;
68
+ readonly scene: THREE.Scene;
69
+ readonly camera: THREE.OrthographicCamera;
70
+ readonly material: THREE.ShaderMaterial;
71
+ readonly points: THREE.Points;
72
+
73
+ constructor(
74
+ renderer: THREE.WebGLRenderer,
75
+ particleTextureSize: number,
76
+ { mobile = false }: SPHFieldOptions = {},
77
+ ) {
78
+ this.renderer = renderer;
79
+ this.particleTextureSize = particleTextureSize;
80
+ this.particleCount = particleTextureSize * particleTextureSize;
81
+ this.grid = new THREE.Vector3(mobile ? 48 : 64, mobile ? 30 : 36, mobile ? 20 : 28);
82
+ this.tiles = new THREE.Vector2(mobile ? 5 : 7, 4);
83
+ this.atlasSize = new THREE.Vector2(this.grid.x * this.tiles.x, this.grid.y * this.tiles.y);
84
+ this.domainMin = new THREE.Vector3(0.2, -0.34, -1.55);
85
+ this.domainMax = new THREE.Vector3(4.9, 1.92, 1.55);
86
+ this.cellSize = new THREE.Vector3();
87
+ this.gridDenominator = new THREE.Vector3(this.grid.x - 1, this.grid.y - 1, this.grid.z - 1);
88
+ this.previousClearColor = new THREE.Color();
89
+ this.kernelRadius = mobile ? 0.125 : 0.105;
90
+ this.sliceLayers = mobile ? [0, 1] : [-1, 0, 1];
91
+
92
+ this.target = createFieldTarget(this.atlasSize.x, this.atlasSize.y);
93
+ this.geometry = createSplatGeometry(particleTextureSize, this.sliceLayers);
94
+ this.geometry.setDrawRange(0, this.particleCount * this.sliceLayers.length);
95
+ this.scene = new THREE.Scene();
96
+ this.camera = new THREE.OrthographicCamera(-1, 1, 1, -1, 0, 1);
97
+
98
+ this.material = new THREE.ShaderMaterial({
99
+ glslVersion: THREE.GLSL3,
100
+ uniforms: {
101
+ uPosition: { value: null },
102
+ uVelocity: { value: null },
103
+ uDomainMin: { value: this.domainMin },
104
+ uDomainMax: { value: this.domainMax },
105
+ uGrid: { value: this.grid },
106
+ uTiles: { value: this.tiles },
107
+ uAtlasSize: { value: this.atlasSize },
108
+ uKernelRadius: { value: this.kernelRadius },
109
+ },
110
+ vertexShader: /* glsl */`
111
+ precision highp float;
112
+ uniform sampler2D uPosition;
113
+ uniform sampler2D uVelocity;
114
+ uniform vec3 uDomainMin;
115
+ uniform vec3 uDomainMax;
116
+ uniform vec3 uGrid;
117
+ uniform vec2 uTiles;
118
+ uniform vec2 uAtlasSize;
119
+ uniform float uKernelRadius;
120
+ in vec2 aLookup;
121
+ in float aSliceOffset;
122
+ out vec3 vVelocity;
123
+ out float vSliceDistance;
124
+ out float vAlive;
125
+
126
+ void main() {
127
+ vec4 state = texture(uPosition, aLookup);
128
+ vec3 velocity = texture(uVelocity, aLookup).xyz;
129
+ vec3 normalizedPosition = (state.xyz - uDomainMin) / (uDomainMax - uDomainMin);
130
+ float sliceCoordinate = normalizedPosition.z * (uGrid.z - 1.0);
131
+ float slice = floor(sliceCoordinate) + aSliceOffset;
132
+ bool inDomain = all(greaterThanEqual(normalizedPosition, vec3(0.0)))
133
+ && all(lessThanEqual(normalizedPosition, vec3(1.0)));
134
+ bool validSlice = slice >= 0.0 && slice < uGrid.z;
135
+ vAlive = step(0.0, state.w) * float(inDomain && validSlice);
136
+ vVelocity = velocity;
137
+ float cellDepth = (uDomainMax.z - uDomainMin.z) / max(uGrid.z - 1.0, 1.0);
138
+ vSliceDistance = (slice - sliceCoordinate) * cellDepth;
139
+
140
+ vec2 tile = vec2(mod(slice, uTiles.x), floor(slice / uTiles.x));
141
+ vec2 localCell = normalizedPosition.xy * (uGrid.xy - 1.0) + vec2(0.5);
142
+ vec2 atlasUv = (tile * uGrid.xy + localCell) / uAtlasSize;
143
+ gl_Position = vAlive > 0.5 ? vec4(atlasUv * 2.0 - 1.0, 0.0, 1.0) : vec4(2.0, 2.0, 2.0, 1.0);
144
+ vec2 cellWorld = (uDomainMax.xy - uDomainMin.xy) / max(uGrid.xy - 1.0, vec2(1.0));
145
+ gl_PointSize = 2.0 * uKernelRadius / max(min(cellWorld.x, cellWorld.y), 0.0001);
146
+ }
147
+ `,
148
+ fragmentShader: /* glsl */`
149
+ precision highp float;
150
+ uniform float uKernelRadius;
151
+ in vec3 vVelocity;
152
+ in float vSliceDistance;
153
+ in float vAlive;
154
+ layout(location = 0) out vec4 outDensity;
155
+ layout(location = 1) out vec4 outMomentum;
156
+
157
+ void main() {
158
+ if (vAlive < 0.5) discard;
159
+ vec2 radial = gl_PointCoord * 2.0 - 1.0;
160
+ float distanceSquared = dot(radial, radial)
161
+ + (vSliceDistance * vSliceDistance) / max(uKernelRadius * uKernelRadius, 0.000001);
162
+ if (distanceSquared >= 1.0) discard;
163
+ float kernel = pow(1.0 - distanceSquared, 3.0);
164
+ outDensity = vec4(kernel, 0.0, 0.0, kernel);
165
+ outMomentum = vec4(vVelocity * kernel, kernel);
166
+ }
167
+ `,
168
+ transparent: true,
169
+ depthTest: false,
170
+ depthWrite: false,
171
+ blending: THREE.AdditiveBlending,
172
+ toneMapped: false,
173
+ });
174
+
175
+ this.points = new THREE.Points(this.geometry, this.material);
176
+ this.points.frustumCulled = false;
177
+ this.scene.add(this.points);
178
+ this.updateCellSize();
179
+ }
180
+
181
+ updateCellSize(): void {
182
+ this.cellSize.copy(this.domainMax).sub(this.domainMin).divide(this.gridDenominator);
183
+ }
184
+
185
+ setDomain(minimum: THREE.Vector3, maximum: THREE.Vector3): void {
186
+ this.domainMin.copy(minimum);
187
+ this.domainMax.copy(maximum);
188
+ this.updateCellSize();
189
+ }
190
+
191
+ setActiveCount(count: number): void {
192
+ const activeCount = THREE.MathUtils.clamp(Math.floor(count), 1, this.particleCount);
193
+ this.geometry.setDrawRange(0, activeCount * this.sliceLayers.length);
194
+ }
195
+
196
+ build(positionTexture: THREE.Texture, velocityTexture: THREE.Texture): void {
197
+ this.material.uniforms.uPosition.value = positionTexture;
198
+ this.material.uniforms.uVelocity.value = velocityTexture;
199
+ const previousTarget = this.renderer.getRenderTarget();
200
+ const previousColor = this.renderer.getClearColor(this.previousClearColor);
201
+ const previousAlpha = this.renderer.getClearAlpha();
202
+ const previousAutoClear = this.renderer.autoClear;
203
+
204
+ this.renderer.autoClear = true;
205
+ this.renderer.setClearColor(0x000000, 0);
206
+ this.renderer.setRenderTarget(this.target);
207
+ this.renderer.clear(true, false, false);
208
+ this.renderer.render(this.scene, this.camera);
209
+
210
+ this.renderer.setRenderTarget(previousTarget);
211
+ this.renderer.setClearColor(previousColor, previousAlpha);
212
+ this.renderer.autoClear = previousAutoClear;
213
+ }
214
+
215
+ get densityTexture(): THREE.Texture {
216
+ return this.target.textures[0];
217
+ }
218
+
219
+ get momentumTexture(): THREE.Texture {
220
+ return this.target.textures[1];
221
+ }
222
+
223
+ dispose(): void {
224
+ this.target.dispose();
225
+ this.geometry.dispose();
226
+ this.material.dispose();
227
+ }
228
+ }
@@ -1,69 +1,69 @@
1
- import * as THREE from 'three';
2
- import { Pass } from 'three/examples/jsm/postprocessing/Pass.js';
3
- import type { FluidQuality, PartialBaseTextures, ScreenSpaceFluidPassOptions, ScreenSpaceFluidSource, WaterFlowRenderOptions } from './types';
4
- export declare class ScreenSpaceFluidPass extends Pass {
5
- /**
6
- * 字段集中声明。
7
- *
8
- * 构造器在 `if (!this.supported) return;` 处提前返回,因此下面标注 `T | null` 的这批资源字段
9
- * 在「不支持 WebGL2 / 浮点纹理」的空壳实例上**根本没被赋值**(运行时是 undefined,不是 null)。
10
- * 一律建模为 `T | null` 而不是用 `!` 硬压,且所有读取点都在 `if (!this.supported) return;`
11
- * 守卫之后(setSize/dispose 里原有的 `?.` 也照留),语义与原实现逐字节一致。
12
- */
13
- private readonly scene;
14
- /** setSize 要读 camera.fov 算 pointScale,故按透视相机建模。 */
15
- private readonly camera;
16
- private readonly simulation;
17
- private readonly supported;
18
- private scale;
19
- private airFraction;
20
- private activeCount;
21
- /** 外部注入的基础纹理;只在 renderInto 里被赋值,此前为 undefined,setBaseTextures 的 falsy 守卫会直接返回。 */
22
- private externalBase;
23
- /** 由 setSize 写入(构造器 supported 分支末尾调用过),空壳实例上为 undefined。 */
24
- private width;
25
- private height;
26
- private readonly sceneTarget;
27
- private readonly depthTarget;
28
- private readonly thicknessTarget;
29
- private readonly blurA;
30
- private readonly blurB;
31
- private readonly thicknessBlurA;
32
- private readonly thicknessBlurB;
33
- private readonly compositeTarget;
34
- private readonly lookupGeometry;
35
- private readonly depthMaterial;
36
- private readonly thicknessMaterial;
37
- private readonly sprayMaterial;
38
- private readonly depthBlurMaterial;
39
- private readonly thicknessBlurMaterial;
40
- private readonly compositeMaterial;
41
- private readonly copyMaterial;
42
- private readonly particleScene;
43
- private readonly sprayScene;
44
- private readonly depthPoints;
45
- private readonly sprayPoints;
46
- private readonly fsQuad;
47
- constructor(scene: THREE.Scene, camera: THREE.PerspectiveCamera, simulation: ScreenSpaceFluidSource, { width, height, scale, activeCount }?: ScreenSpaceFluidPassOptions);
48
- setAirFraction(value: number): void;
49
- setParticleRadius(value: number): void;
50
- setRetainedFluidVisible(visible: boolean): void;
51
- setQuality({ scale, activeCount, blurRadius }: FluidQuality): void;
52
- /** three-base 等外部调用方在 resize / 切换 baseRT 时刷新注入的基础纹理。 */
53
- setBaseTextures({ colorTexture, depthTexture, depthMode }?: PartialBaseTextures): void;
54
- setSize(width: number, height: number): void;
55
- /** 渲染粒子深度/厚度 + 两轮分离模糊 + 厚度模糊(不输出合成、不渲染 spray)。render/renderInto 共用。 */
56
- renderFluidTextures(renderer: THREE.WebGLRenderer, camera?: THREE.Camera): void;
57
- /** EffectComposer 链入口(自渲染模式 / base 纹理注入模式通用,保持原行为不变)。 */
58
- render(renderer: THREE.WebGLRenderer, writeBuffer: THREE.WebGLRenderTarget): void;
59
- /**
60
- * 函数式入口:直接消费调用方已有的基础颜色/深度纹理,把水面合成到指定目标。
61
- * 与 three-base 的手写 fsQuad 后处理链(frosted_glass_pass 等)形态一致:
62
- * 不创建/自渲染主场景,composite 先写到内部 compositeTarget,再拷回 outputTarget,
63
- * 避免「读 baseRenderTarget 写 baseRenderTarget」的反馈未定义行为。
64
- * @param {THREE.WebGLRenderer} renderer
65
- * @param {{colorTexture:THREE.Texture,depthTexture:THREE.Texture,depthMode?:'standard'|'logarithmic',outputTarget:THREE.WebGLRenderTarget,camera:THREE.Camera}} opts
66
- */
67
- renderInto(renderer: THREE.WebGLRenderer, opts: WaterFlowRenderOptions): void;
68
- dispose(): void;
69
- }
1
+ import * as THREE from 'three';
2
+ import { Pass } from 'three/examples/jsm/postprocessing/Pass.js';
3
+ import type { FluidQuality, PartialBaseTextures, ScreenSpaceFluidPassOptions, ScreenSpaceFluidSource, WaterFlowRenderOptions } from './types';
4
+ export declare class ScreenSpaceFluidPass extends Pass {
5
+ /**
6
+ * 字段集中声明。
7
+ *
8
+ * 构造器在 `if (!this.supported) return;` 处提前返回,因此下面标注 `T | null` 的这批资源字段
9
+ * 在「不支持 WebGL2 / 浮点纹理」的空壳实例上**根本没被赋值**(运行时是 undefined,不是 null)。
10
+ * 一律建模为 `T | null` 而不是用 `!` 硬压,且所有读取点都在 `if (!this.supported) return;`
11
+ * 守卫之后(setSize/dispose 里原有的 `?.` 也照留),语义与原实现逐字节一致。
12
+ */
13
+ private readonly scene;
14
+ /** setSize 要读 camera.fov 算 pointScale,故按透视相机建模。 */
15
+ private readonly camera;
16
+ private readonly simulation;
17
+ private readonly supported;
18
+ private scale;
19
+ private airFraction;
20
+ private activeCount;
21
+ /** 外部注入的基础纹理;只在 renderInto 里被赋值,此前为 undefined,setBaseTextures 的 falsy 守卫会直接返回。 */
22
+ private externalBase;
23
+ /** 由 setSize 写入(构造器 supported 分支末尾调用过),空壳实例上为 undefined。 */
24
+ private width;
25
+ private height;
26
+ private readonly sceneTarget;
27
+ private readonly depthTarget;
28
+ private readonly thicknessTarget;
29
+ private readonly blurA;
30
+ private readonly blurB;
31
+ private readonly thicknessBlurA;
32
+ private readonly thicknessBlurB;
33
+ private readonly compositeTarget;
34
+ private readonly lookupGeometry;
35
+ private readonly depthMaterial;
36
+ private readonly thicknessMaterial;
37
+ private readonly sprayMaterial;
38
+ private readonly depthBlurMaterial;
39
+ private readonly thicknessBlurMaterial;
40
+ private readonly compositeMaterial;
41
+ private readonly copyMaterial;
42
+ private readonly particleScene;
43
+ private readonly sprayScene;
44
+ private readonly depthPoints;
45
+ private readonly sprayPoints;
46
+ private readonly fsQuad;
47
+ constructor(scene: THREE.Scene, camera: THREE.PerspectiveCamera, simulation: ScreenSpaceFluidSource, { width, height, scale, activeCount }?: ScreenSpaceFluidPassOptions);
48
+ setAirFraction(value: number): void;
49
+ setParticleRadius(value: number): void;
50
+ setRetainedFluidVisible(visible: boolean): void;
51
+ setQuality({ scale, activeCount, blurRadius }: FluidQuality): void;
52
+ /** three-base 等外部调用方在 resize / 切换 baseRT 时刷新注入的基础纹理。 */
53
+ setBaseTextures({ colorTexture, depthTexture, depthMode }?: PartialBaseTextures): void;
54
+ setSize(width: number, height: number): void;
55
+ /** 渲染粒子深度/厚度 + 两轮分离模糊 + 厚度模糊(不输出合成、不渲染 spray)。render/renderInto 共用。 */
56
+ renderFluidTextures(renderer: THREE.WebGLRenderer, camera?: THREE.Camera): void;
57
+ /** EffectComposer 链入口(自渲染模式 / base 纹理注入模式通用,保持原行为不变)。 */
58
+ render(renderer: THREE.WebGLRenderer, writeBuffer: THREE.WebGLRenderTarget): void;
59
+ /**
60
+ * 函数式入口:直接消费调用方已有的基础颜色/深度纹理,把水面合成到指定目标。
61
+ * 与 three-base 的手写 fsQuad 后处理链(frosted_glass_pass 等)形态一致:
62
+ * 不创建/自渲染主场景,composite 先写到内部 compositeTarget,再拷回 outputTarget,
63
+ * 避免「读 baseRenderTarget 写 baseRenderTarget」的反馈未定义行为。
64
+ * @param {THREE.WebGLRenderer} renderer
65
+ * @param {{colorTexture:THREE.Texture,depthTexture:THREE.Texture,depthMode?:'standard'|'logarithmic',outputTarget:THREE.WebGLRenderTarget,camera:THREE.Camera}} opts
66
+ */
67
+ renderInto(renderer: THREE.WebGLRenderer, opts: WaterFlowRenderOptions): void;
68
+ dispose(): void;
69
+ }