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.
- package/DirectionalLight.d.ts +6 -6
- package/DirectionalLight.js +68 -68
- package/EventMap.d.ts +103 -103
- package/EventMap.js +17 -17
- package/EventMesh.d.ts +18 -18
- package/EventMesh.js +59 -59
- package/ExtrudeMesh.d.ts +112 -112
- package/ExtrudeMesh.js +342 -342
- package/FPScontrol.d.ts +531 -511
- package/FPScontrol.js +1866 -1799
- package/FPScontrol.ts +1922 -1855
- package/Fire/Fire.d.ts +28 -28
- package/Fire/Fire.js +80 -80
- package/Fire/FireGeometry.d.ts +9 -9
- package/Fire/FireGeometry.js +40 -40
- package/Fire/FireMaterial.d.ts +28 -28
- package/Fire/FireMaterial.js +32 -32
- package/Fire/index.d.ts +2 -2
- package/Fire/index.js +2 -2
- package/GLTFDracoLoader.d.ts +71 -71
- package/GLTFDracoLoader.js +266 -266
- package/GLTFDracoLoader.ts +1 -1
- package/Grass/Grass.d.ts +8 -8
- package/Grass/Grass.js +38 -38
- package/Grass/index.d.ts +2 -2
- package/Grass/index.js +2 -2
- package/Ground1/Ground1.d.ts +10 -10
- package/Ground1/Ground1.js +71 -71
- package/Ground1/index.d.ts +1 -1
- package/Ground1/index.js +1 -1
- package/MeshBase.d.ts +36 -36
- package/MeshBase.js +251 -247
- package/MeshBase.ts +6 -2
- package/Mirror.d.ts +25 -25
- package/Mirror.js +143 -143
- package/MktMesh/MktMesh.d.ts +301 -291
- package/MktMesh/MktMesh.js +1064 -1045
- package/MktMesh/MktMesh.ts +32 -11
- package/MktMesh/assetUrl.d.ts +59 -35
- package/MktMesh/assetUrl.js +165 -69
- package/MktMesh/assetUrl.ts +164 -69
- package/MktMesh/mktMappingShader.d.ts +12 -12
- package/MktMesh/mktMappingShader.js +138 -138
- package/MktMesh/mktMappingShader.ts +139 -139
- package/MktMesh/mktShader.d.ts +263 -263
- package/MktMesh/mktShader.js +1236 -1236
- package/MktMesh/mktShader.ts +1344 -1344
- package/MktMesh/panoBitmapTexture.d.ts +25 -25
- package/MktMesh/panoBitmapTexture.js +52 -52
- package/MktMesh/panoBitmapTexture.ts +54 -54
- package/MktMesh/panoSlotBind.d.ts +29 -29
- package/MktMesh/panoSlotBind.js +106 -106
- package/MktMesh/panoSlotBind.ts +153 -153
- package/MktMesh/panoSlotRoster.d.ts +22 -22
- package/MktMesh/panoSlotRoster.js +169 -169
- package/MktMesh/panoSlotRoster.ts +168 -168
- package/MktMesh/panoTileStitcher.d.ts +119 -119
- package/MktMesh/panoTileStitcher.js +529 -529
- package/MktMesh/panoTileStitcher.ts +616 -616
- package/MktMesh/types.d.ts +75 -75
- package/MktMesh/types.js +1 -1
- package/MktMesh/wallCapTessellate.d.ts +33 -33
- package/MktMesh/wallCapTessellate.js +97 -97
- package/MktMesh/wallCapTessellate.ts +68 -68
- package/PipeMesh/PathGeometry.d.ts +44 -44
- package/PipeMesh/PathGeometry.js +307 -307
- package/PipeMesh/PathPoint.d.ts +17 -17
- package/PipeMesh/PathPoint.js +31 -31
- package/PipeMesh/PathPointList.d.ts +31 -31
- package/PipeMesh/PathPointList.js +209 -209
- 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 +34 -34
- package/PlaneModal1/PlaneModal1.js +109 -109
- package/PlaneModal1/index.d.ts +1 -1
- package/PlaneModal1/index.js +1 -1
- package/PlaneText.d.ts +27 -27
- package/PlaneText.js +35 -35
- package/PlaneWithHtml.d.ts +13 -13
- package/PlaneWithHtml.js +66 -64
- package/PlaneWithHtml.ts +3 -1
- 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 +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 -6
- package/SpotLight.js +72 -72
- package/SpriteModal1/SpriteModal1.d.ts +33 -33
- package/SpriteModal1/SpriteModal1.js +116 -116
- package/SpriteModal1/index.d.ts +1 -1
- package/SpriteModal1/index.js +1 -1
- package/SpriteText.d.ts +46 -46
- package/SpriteText.js +176 -176
- package/SpriteText2.d.ts +48 -48
- package/SpriteText2.js +223 -223
- package/SpriteText3.d.ts +86 -86
- package/SpriteText3.js +517 -517
- package/SpriteText3.ts +599 -599
- package/SpriteWithHtml.d.ts +9 -9
- package/SpriteWithHtml.js +46 -44
- package/SpriteWithHtml.ts +3 -1
- package/Text3D/Text3D.d.ts +20 -20
- package/Text3D/Text3D.js +58 -58
- package/Text3D/fontController.d.ts +60 -60
- package/Text3D/fontController.js +166 -166
- package/Text3D/index.d.ts +1 -1
- package/Text3D/index.js +1 -1
- package/ThreeBase.d.ts +248 -248
- package/ThreeBase.js +1202 -1202
- package/ThreeBase.ts +1314 -1314
- package/ThreeMouse.d.ts +53 -54
- package/ThreeMouse.js +453 -453
- package/Transition.d.ts +45 -45
- package/Transition.js +209 -209
- package/Water/Water.d.ts +5 -5
- package/Water/Water.js +44 -44
- package/Water/index.d.ts +2 -2
- package/Water/index.js +2 -2
- package/WaterFlow/FloatingDuck.d.ts +88 -88
- package/WaterFlow/FloatingDuck.js +307 -307
- package/WaterFlow/FloatingDuck.ts +445 -445
- package/WaterFlow/GPUFluidSimulation.d.ts +56 -56
- package/WaterFlow/GPUFluidSimulation.js +781 -781
- package/WaterFlow/GPUFluidSimulation.ts +827 -827
- package/WaterFlow/ReservoirSystem.d.ts +106 -106
- package/WaterFlow/ReservoirSystem.js +611 -611
- package/WaterFlow/ReservoirSystem.ts +754 -754
- package/WaterFlow/SPHField.d.ts +35 -35
- package/WaterFlow/SPHField.js +203 -203
- package/WaterFlow/SPHField.ts +228 -228
- package/WaterFlow/ScreenSpaceFluidPass.d.ts +69 -69
- package/WaterFlow/ScreenSpaceFluidPass.js +728 -728
- package/WaterFlow/ScreenSpaceFluidPass.ts +789 -789
- package/WaterFlow/ShallowWaterSurface.d.ts +45 -45
- package/WaterFlow/ShallowWaterSurface.js +438 -438
- package/WaterFlow/ShallowWaterSurface.ts +510 -510
- package/WaterFlow/WaterFlow.d.ts +87 -87
- package/WaterFlow/WaterFlow.js +171 -171
- package/WaterFlow/WaterFlow.ts +219 -219
- package/WaterFlow/types.d.ts +161 -161
- package/WaterFlow/types.js +1 -1
- package/WaterFlow/types.ts +189 -189
- package/WaterFlow/waterFlowPass.d.ts +3 -3
- package/WaterFlow/waterFlowPass.js +20 -20
- package/WaterFlow/waterFlowPass.ts +40 -40
- package/collisionOBB.d.ts +42 -42
- package/collisionOBB.js +112 -112
- package/collisionOBB.ts +108 -108
- package/declare.d.ts +25 -25
- package/index.d.ts +1 -1
- package/index.js +1 -1
- package/instanced/InstancedBatch.d.ts +57 -57
- package/instanced/InstancedBatch.js +348 -348
- package/instanced/InstancedBatch.ts +406 -406
- package/instanced/InstancedChild.d.ts +174 -174
- package/instanced/InstancedChild.js +264 -264
- package/instanced/InstancedChild.ts +327 -327
- package/instanced/InstancedGroup.d.ts +43 -43
- package/instanced/InstancedGroup.js +126 -126
- package/instanced/InstancedGroup.ts +137 -137
- package/instanced/InstancedMeshBase.d.ts +38 -38
- package/instanced/InstancedMeshBase.js +282 -282
- package/instanced/InstancedTemplate.d.ts +46 -46
- package/instanced/InstancedTemplate.js +125 -125
- package/keyControls.d.ts +29 -30
- package/keyControls.js +101 -101
- package/lensflare/LensFlare.d.ts +39 -39
- package/lensflare/LensFlare.js +284 -284
- package/package.json +6 -1
- package/pass/bloom_pass.d.ts +2 -2
- package/pass/bloom_pass.js +174 -174
- package/pass/cover_pass.d.ts +2 -2
- package/pass/cover_pass.js +108 -108
- package/pass/debugDepthState.d.ts +20 -20
- package/pass/debugDepthState.js +9 -9
- package/pass/debugDepthState.ts +22 -22
- package/pass/depthTestBias.d.ts +12 -12
- package/pass/depthTestBias.js +12 -12
- package/pass/depthTestBias.ts +12 -12
- package/pass/effectUserData.d.ts +27 -27
- package/pass/effectUserData.js +1 -1
- package/pass/effectUserData.ts +46 -46
- package/pass/frosted_glass_pass.d.ts +2 -2
- package/pass/frosted_glass_pass.js +150 -150
- 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 +350 -350
- package/pass/screen_bloom_pass.d.ts +11 -11
- package/pass/screen_bloom_pass.js +136 -136
- package/pass/ssao_pass.d.ts +88 -88
- package/pass/ssao_pass.js +799 -799
- package/pass/ssao_pass.ts +918 -918
- package/pass/stroke_pass.d.ts +2 -2
- package/pass/stroke_pass.js +267 -267
- package/shaders/FXAAShaderMaterial.d.ts +3 -3
- package/shaders/FXAAShaderMaterial.js +20 -20
- package/shaders/baseDepthVisShader.d.ts +11 -11
- package/shaders/baseDepthVisShader.js +36 -36
- package/shaders/baseDepthVisShader.ts +36 -36
- package/shaders/baseTextureToRenderShader.d.ts +2 -2
- package/shaders/baseTextureToRenderShader.js +19 -19
- package/shaders/copyShader.d.ts +3 -3
- package/shaders/copyShader.js +13 -13
- package/shaders/debugDepthCompareShader.d.ts +14 -14
- package/shaders/debugDepthCompareShader.js +49 -49
- package/shaders/debugDepthCompareShader.ts +50 -50
- package/shaders/debugDepthJudgeShader.d.ts +18 -18
- package/shaders/debugDepthJudgeShader.js +52 -52
- package/shaders/debugDepthJudgeShader.ts +54 -54
- package/shaders/debugExcludedShader.d.ts +13 -13
- package/shaders/debugExcludedShader.js +46 -46
- package/shaders/debugExcludedShader.ts +48 -48
- package/spriteTextBg.d.ts +1 -1
- package/spriteTextBg.js +20 -20
- package/spriteTextBg.ts +20 -20
- package/threeLoader.d.ts +35 -35
- package/threeLoader.js +518 -518
- package/threeUtils.d.ts +71 -53
- package/threeUtils.js +363 -329
- package/threeUtils.ts +35 -0
- package/types.d.ts +2 -2
- package/types.js +6 -6
package/WaterFlow/SPHField.d.ts
CHANGED
|
@@ -1,35 +1,35 @@
|
|
|
1
|
-
import * as THREE from 'three';
|
|
2
|
-
import type { SPHFieldOptions } from './types';
|
|
3
|
-
/**
|
|
4
|
-
* SPH(光滑粒子流体)栅格场:把每个粒子的密度/动量 splat 进一张 3D 切片图集,
|
|
5
|
-
* 供 GPUFluidSimulation 的 updateMaterial 采样(网格辅助 SPH 的「场」那一半)。
|
|
6
|
-
*/
|
|
7
|
-
export declare class SPHField {
|
|
8
|
-
readonly renderer: THREE.WebGLRenderer;
|
|
9
|
-
readonly particleTextureSize: number;
|
|
10
|
-
readonly particleCount: number;
|
|
11
|
-
readonly grid: THREE.Vector3;
|
|
12
|
-
readonly tiles: THREE.Vector2;
|
|
13
|
-
readonly atlasSize: THREE.Vector2;
|
|
14
|
-
readonly domainMin: THREE.Vector3;
|
|
15
|
-
readonly domainMax: THREE.Vector3;
|
|
16
|
-
readonly cellSize: THREE.Vector3;
|
|
17
|
-
readonly gridDenominator: THREE.Vector3;
|
|
18
|
-
readonly previousClearColor: THREE.Color;
|
|
19
|
-
readonly kernelRadius: number;
|
|
20
|
-
readonly sliceLayers: number[];
|
|
21
|
-
readonly target: THREE.WebGLRenderTarget;
|
|
22
|
-
readonly geometry: THREE.BufferGeometry;
|
|
23
|
-
readonly scene: THREE.Scene;
|
|
24
|
-
readonly camera: THREE.OrthographicCamera;
|
|
25
|
-
readonly material: THREE.ShaderMaterial;
|
|
26
|
-
readonly points: THREE.Points;
|
|
27
|
-
constructor(renderer: THREE.WebGLRenderer, particleTextureSize: number, { mobile }?: SPHFieldOptions);
|
|
28
|
-
updateCellSize(): void;
|
|
29
|
-
setDomain(minimum: THREE.Vector3, maximum: THREE.Vector3): void;
|
|
30
|
-
setActiveCount(count: number): void;
|
|
31
|
-
build(positionTexture: THREE.Texture, velocityTexture: THREE.Texture): void;
|
|
32
|
-
get densityTexture(): THREE.Texture;
|
|
33
|
-
get momentumTexture(): THREE.Texture;
|
|
34
|
-
dispose(): void;
|
|
35
|
-
}
|
|
1
|
+
import * as THREE from 'three';
|
|
2
|
+
import type { SPHFieldOptions } from './types';
|
|
3
|
+
/**
|
|
4
|
+
* SPH(光滑粒子流体)栅格场:把每个粒子的密度/动量 splat 进一张 3D 切片图集,
|
|
5
|
+
* 供 GPUFluidSimulation 的 updateMaterial 采样(网格辅助 SPH 的「场」那一半)。
|
|
6
|
+
*/
|
|
7
|
+
export declare class SPHField {
|
|
8
|
+
readonly renderer: THREE.WebGLRenderer;
|
|
9
|
+
readonly particleTextureSize: number;
|
|
10
|
+
readonly particleCount: number;
|
|
11
|
+
readonly grid: THREE.Vector3;
|
|
12
|
+
readonly tiles: THREE.Vector2;
|
|
13
|
+
readonly atlasSize: THREE.Vector2;
|
|
14
|
+
readonly domainMin: THREE.Vector3;
|
|
15
|
+
readonly domainMax: THREE.Vector3;
|
|
16
|
+
readonly cellSize: THREE.Vector3;
|
|
17
|
+
readonly gridDenominator: THREE.Vector3;
|
|
18
|
+
readonly previousClearColor: THREE.Color;
|
|
19
|
+
readonly kernelRadius: number;
|
|
20
|
+
readonly sliceLayers: number[];
|
|
21
|
+
readonly target: THREE.WebGLRenderTarget;
|
|
22
|
+
readonly geometry: THREE.BufferGeometry;
|
|
23
|
+
readonly scene: THREE.Scene;
|
|
24
|
+
readonly camera: THREE.OrthographicCamera;
|
|
25
|
+
readonly material: THREE.ShaderMaterial;
|
|
26
|
+
readonly points: THREE.Points;
|
|
27
|
+
constructor(renderer: THREE.WebGLRenderer, particleTextureSize: number, { mobile }?: SPHFieldOptions);
|
|
28
|
+
updateCellSize(): void;
|
|
29
|
+
setDomain(minimum: THREE.Vector3, maximum: THREE.Vector3): void;
|
|
30
|
+
setActiveCount(count: number): void;
|
|
31
|
+
build(positionTexture: THREE.Texture, velocityTexture: THREE.Texture): void;
|
|
32
|
+
get densityTexture(): THREE.Texture;
|
|
33
|
+
get momentumTexture(): THREE.Texture;
|
|
34
|
+
dispose(): void;
|
|
35
|
+
}
|
package/WaterFlow/SPHField.js
CHANGED
|
@@ -1,204 +1,204 @@
|
|
|
1
|
-
import * as THREE from 'three';
|
|
2
|
-
function createFieldTarget(width, height) {
|
|
3
|
-
const target = new THREE.WebGLRenderTarget(width, height, {
|
|
4
|
-
count: 2,
|
|
5
|
-
format: THREE.RGBAFormat,
|
|
6
|
-
type: THREE.HalfFloatType,
|
|
7
|
-
minFilter: THREE.LinearFilter,
|
|
8
|
-
magFilter: THREE.LinearFilter,
|
|
9
|
-
wrapS: THREE.ClampToEdgeWrapping,
|
|
10
|
-
wrapT: THREE.ClampToEdgeWrapping,
|
|
11
|
-
depthBuffer: false,
|
|
12
|
-
stencilBuffer: false,
|
|
13
|
-
});
|
|
14
|
-
target.textures[0].name = 'SPHDensityField';
|
|
15
|
-
target.textures[1].name = 'SPHMomentumField';
|
|
16
|
-
return target;
|
|
17
|
-
}
|
|
18
|
-
function createSplatGeometry(size, sliceLayers) {
|
|
19
|
-
const particleCount = size * size;
|
|
20
|
-
const vertexCount = particleCount * sliceLayers.length;
|
|
21
|
-
const positions = new Float32Array(vertexCount * 3);
|
|
22
|
-
const lookup = new Float32Array(vertexCount * 2);
|
|
23
|
-
const sliceOffset = new Float32Array(vertexCount);
|
|
24
|
-
let vertex = 0;
|
|
25
|
-
for (let particle = 0; particle < particleCount; particle++) {
|
|
26
|
-
const x = particle % size;
|
|
27
|
-
const y = Math.floor(particle / size);
|
|
28
|
-
for (const offset of sliceLayers) {
|
|
29
|
-
lookup[vertex * 2] = (x + 0.5) / size;
|
|
30
|
-
lookup[vertex * 2 + 1] = (y + 0.5) / size;
|
|
31
|
-
sliceOffset[vertex] = offset;
|
|
32
|
-
vertex++;
|
|
33
|
-
}
|
|
34
|
-
}
|
|
35
|
-
const geometry = new THREE.BufferGeometry();
|
|
36
|
-
geometry.setAttribute('position', new THREE.BufferAttribute(positions, 3));
|
|
37
|
-
geometry.setAttribute('aLookup', new THREE.BufferAttribute(lookup, 2));
|
|
38
|
-
geometry.setAttribute('aSliceOffset', new THREE.BufferAttribute(sliceOffset, 1));
|
|
39
|
-
return geometry;
|
|
40
|
-
}
|
|
41
|
-
/**
|
|
42
|
-
* SPH(光滑粒子流体)栅格场:把每个粒子的密度/动量 splat 进一张 3D 切片图集,
|
|
43
|
-
* 供 GPUFluidSimulation 的 updateMaterial 采样(网格辅助 SPH 的「场」那一半)。
|
|
44
|
-
*/
|
|
45
|
-
export class SPHField {
|
|
46
|
-
renderer;
|
|
47
|
-
particleTextureSize;
|
|
48
|
-
particleCount;
|
|
49
|
-
grid;
|
|
50
|
-
tiles;
|
|
51
|
-
atlasSize;
|
|
52
|
-
domainMin;
|
|
53
|
-
domainMax;
|
|
54
|
-
cellSize;
|
|
55
|
-
gridDenominator;
|
|
56
|
-
previousClearColor;
|
|
57
|
-
kernelRadius;
|
|
58
|
-
sliceLayers;
|
|
59
|
-
target;
|
|
60
|
-
geometry;
|
|
61
|
-
scene;
|
|
62
|
-
camera;
|
|
63
|
-
material;
|
|
64
|
-
points;
|
|
65
|
-
constructor(renderer, particleTextureSize, { mobile = false } = {}) {
|
|
66
|
-
this.renderer = renderer;
|
|
67
|
-
this.particleTextureSize = particleTextureSize;
|
|
68
|
-
this.particleCount = particleTextureSize * particleTextureSize;
|
|
69
|
-
this.grid = new THREE.Vector3(mobile ? 48 : 64, mobile ? 30 : 36, mobile ? 20 : 28);
|
|
70
|
-
this.tiles = new THREE.Vector2(mobile ? 5 : 7, 4);
|
|
71
|
-
this.atlasSize = new THREE.Vector2(this.grid.x * this.tiles.x, this.grid.y * this.tiles.y);
|
|
72
|
-
this.domainMin = new THREE.Vector3(0.2, -0.34, -1.55);
|
|
73
|
-
this.domainMax = new THREE.Vector3(4.9, 1.92, 1.55);
|
|
74
|
-
this.cellSize = new THREE.Vector3();
|
|
75
|
-
this.gridDenominator = new THREE.Vector3(this.grid.x - 1, this.grid.y - 1, this.grid.z - 1);
|
|
76
|
-
this.previousClearColor = new THREE.Color();
|
|
77
|
-
this.kernelRadius = mobile ? 0.125 : 0.105;
|
|
78
|
-
this.sliceLayers = mobile ? [0, 1] : [-1, 0, 1];
|
|
79
|
-
this.target = createFieldTarget(this.atlasSize.x, this.atlasSize.y);
|
|
80
|
-
this.geometry = createSplatGeometry(particleTextureSize, this.sliceLayers);
|
|
81
|
-
this.geometry.setDrawRange(0, this.particleCount * this.sliceLayers.length);
|
|
82
|
-
this.scene = new THREE.Scene();
|
|
83
|
-
this.camera = new THREE.OrthographicCamera(-1, 1, 1, -1, 0, 1);
|
|
84
|
-
this.material = new THREE.ShaderMaterial({
|
|
85
|
-
glslVersion: THREE.GLSL3,
|
|
86
|
-
uniforms: {
|
|
87
|
-
uPosition: { value: null },
|
|
88
|
-
uVelocity: { value: null },
|
|
89
|
-
uDomainMin: { value: this.domainMin },
|
|
90
|
-
uDomainMax: { value: this.domainMax },
|
|
91
|
-
uGrid: { value: this.grid },
|
|
92
|
-
uTiles: { value: this.tiles },
|
|
93
|
-
uAtlasSize: { value: this.atlasSize },
|
|
94
|
-
uKernelRadius: { value: this.kernelRadius },
|
|
95
|
-
},
|
|
96
|
-
vertexShader: /* glsl */ `
|
|
97
|
-
precision highp float;
|
|
98
|
-
uniform sampler2D uPosition;
|
|
99
|
-
uniform sampler2D uVelocity;
|
|
100
|
-
uniform vec3 uDomainMin;
|
|
101
|
-
uniform vec3 uDomainMax;
|
|
102
|
-
uniform vec3 uGrid;
|
|
103
|
-
uniform vec2 uTiles;
|
|
104
|
-
uniform vec2 uAtlasSize;
|
|
105
|
-
uniform float uKernelRadius;
|
|
106
|
-
in vec2 aLookup;
|
|
107
|
-
in float aSliceOffset;
|
|
108
|
-
out vec3 vVelocity;
|
|
109
|
-
out float vSliceDistance;
|
|
110
|
-
out float vAlive;
|
|
111
|
-
|
|
112
|
-
void main() {
|
|
113
|
-
vec4 state = texture(uPosition, aLookup);
|
|
114
|
-
vec3 velocity = texture(uVelocity, aLookup).xyz;
|
|
115
|
-
vec3 normalizedPosition = (state.xyz - uDomainMin) / (uDomainMax - uDomainMin);
|
|
116
|
-
float sliceCoordinate = normalizedPosition.z * (uGrid.z - 1.0);
|
|
117
|
-
float slice = floor(sliceCoordinate) + aSliceOffset;
|
|
118
|
-
bool inDomain = all(greaterThanEqual(normalizedPosition, vec3(0.0)))
|
|
119
|
-
&& all(lessThanEqual(normalizedPosition, vec3(1.0)));
|
|
120
|
-
bool validSlice = slice >= 0.0 && slice < uGrid.z;
|
|
121
|
-
vAlive = step(0.0, state.w) * float(inDomain && validSlice);
|
|
122
|
-
vVelocity = velocity;
|
|
123
|
-
float cellDepth = (uDomainMax.z - uDomainMin.z) / max(uGrid.z - 1.0, 1.0);
|
|
124
|
-
vSliceDistance = (slice - sliceCoordinate) * cellDepth;
|
|
125
|
-
|
|
126
|
-
vec2 tile = vec2(mod(slice, uTiles.x), floor(slice / uTiles.x));
|
|
127
|
-
vec2 localCell = normalizedPosition.xy * (uGrid.xy - 1.0) + vec2(0.5);
|
|
128
|
-
vec2 atlasUv = (tile * uGrid.xy + localCell) / uAtlasSize;
|
|
129
|
-
gl_Position = vAlive > 0.5 ? vec4(atlasUv * 2.0 - 1.0, 0.0, 1.0) : vec4(2.0, 2.0, 2.0, 1.0);
|
|
130
|
-
vec2 cellWorld = (uDomainMax.xy - uDomainMin.xy) / max(uGrid.xy - 1.0, vec2(1.0));
|
|
131
|
-
gl_PointSize = 2.0 * uKernelRadius / max(min(cellWorld.x, cellWorld.y), 0.0001);
|
|
132
|
-
}
|
|
133
|
-
`,
|
|
134
|
-
fragmentShader: /* glsl */ `
|
|
135
|
-
precision highp float;
|
|
136
|
-
uniform float uKernelRadius;
|
|
137
|
-
in vec3 vVelocity;
|
|
138
|
-
in float vSliceDistance;
|
|
139
|
-
in float vAlive;
|
|
140
|
-
layout(location = 0) out vec4 outDensity;
|
|
141
|
-
layout(location = 1) out vec4 outMomentum;
|
|
142
|
-
|
|
143
|
-
void main() {
|
|
144
|
-
if (vAlive < 0.5) discard;
|
|
145
|
-
vec2 radial = gl_PointCoord * 2.0 - 1.0;
|
|
146
|
-
float distanceSquared = dot(radial, radial)
|
|
147
|
-
+ (vSliceDistance * vSliceDistance) / max(uKernelRadius * uKernelRadius, 0.000001);
|
|
148
|
-
if (distanceSquared >= 1.0) discard;
|
|
149
|
-
float kernel = pow(1.0 - distanceSquared, 3.0);
|
|
150
|
-
outDensity = vec4(kernel, 0.0, 0.0, kernel);
|
|
151
|
-
outMomentum = vec4(vVelocity * kernel, kernel);
|
|
1
|
+
import * as THREE from 'three';
|
|
2
|
+
function createFieldTarget(width, height) {
|
|
3
|
+
const target = new THREE.WebGLRenderTarget(width, height, {
|
|
4
|
+
count: 2,
|
|
5
|
+
format: THREE.RGBAFormat,
|
|
6
|
+
type: THREE.HalfFloatType,
|
|
7
|
+
minFilter: THREE.LinearFilter,
|
|
8
|
+
magFilter: THREE.LinearFilter,
|
|
9
|
+
wrapS: THREE.ClampToEdgeWrapping,
|
|
10
|
+
wrapT: THREE.ClampToEdgeWrapping,
|
|
11
|
+
depthBuffer: false,
|
|
12
|
+
stencilBuffer: false,
|
|
13
|
+
});
|
|
14
|
+
target.textures[0].name = 'SPHDensityField';
|
|
15
|
+
target.textures[1].name = 'SPHMomentumField';
|
|
16
|
+
return target;
|
|
17
|
+
}
|
|
18
|
+
function createSplatGeometry(size, sliceLayers) {
|
|
19
|
+
const particleCount = size * size;
|
|
20
|
+
const vertexCount = particleCount * sliceLayers.length;
|
|
21
|
+
const positions = new Float32Array(vertexCount * 3);
|
|
22
|
+
const lookup = new Float32Array(vertexCount * 2);
|
|
23
|
+
const sliceOffset = new Float32Array(vertexCount);
|
|
24
|
+
let vertex = 0;
|
|
25
|
+
for (let particle = 0; particle < particleCount; particle++) {
|
|
26
|
+
const x = particle % size;
|
|
27
|
+
const y = Math.floor(particle / size);
|
|
28
|
+
for (const offset of sliceLayers) {
|
|
29
|
+
lookup[vertex * 2] = (x + 0.5) / size;
|
|
30
|
+
lookup[vertex * 2 + 1] = (y + 0.5) / size;
|
|
31
|
+
sliceOffset[vertex] = offset;
|
|
32
|
+
vertex++;
|
|
152
33
|
}
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
this.renderer
|
|
186
|
-
this.
|
|
187
|
-
this.
|
|
188
|
-
this.
|
|
189
|
-
this.
|
|
190
|
-
this.
|
|
191
|
-
this.
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
this.
|
|
201
|
-
this.
|
|
202
|
-
this.
|
|
203
|
-
|
|
204
|
-
|
|
34
|
+
}
|
|
35
|
+
const geometry = new THREE.BufferGeometry();
|
|
36
|
+
geometry.setAttribute('position', new THREE.BufferAttribute(positions, 3));
|
|
37
|
+
geometry.setAttribute('aLookup', new THREE.BufferAttribute(lookup, 2));
|
|
38
|
+
geometry.setAttribute('aSliceOffset', new THREE.BufferAttribute(sliceOffset, 1));
|
|
39
|
+
return geometry;
|
|
40
|
+
}
|
|
41
|
+
/**
|
|
42
|
+
* SPH(光滑粒子流体)栅格场:把每个粒子的密度/动量 splat 进一张 3D 切片图集,
|
|
43
|
+
* 供 GPUFluidSimulation 的 updateMaterial 采样(网格辅助 SPH 的「场」那一半)。
|
|
44
|
+
*/
|
|
45
|
+
export class SPHField {
|
|
46
|
+
renderer;
|
|
47
|
+
particleTextureSize;
|
|
48
|
+
particleCount;
|
|
49
|
+
grid;
|
|
50
|
+
tiles;
|
|
51
|
+
atlasSize;
|
|
52
|
+
domainMin;
|
|
53
|
+
domainMax;
|
|
54
|
+
cellSize;
|
|
55
|
+
gridDenominator;
|
|
56
|
+
previousClearColor;
|
|
57
|
+
kernelRadius;
|
|
58
|
+
sliceLayers;
|
|
59
|
+
target;
|
|
60
|
+
geometry;
|
|
61
|
+
scene;
|
|
62
|
+
camera;
|
|
63
|
+
material;
|
|
64
|
+
points;
|
|
65
|
+
constructor(renderer, particleTextureSize, { mobile = false } = {}) {
|
|
66
|
+
this.renderer = renderer;
|
|
67
|
+
this.particleTextureSize = particleTextureSize;
|
|
68
|
+
this.particleCount = particleTextureSize * particleTextureSize;
|
|
69
|
+
this.grid = new THREE.Vector3(mobile ? 48 : 64, mobile ? 30 : 36, mobile ? 20 : 28);
|
|
70
|
+
this.tiles = new THREE.Vector2(mobile ? 5 : 7, 4);
|
|
71
|
+
this.atlasSize = new THREE.Vector2(this.grid.x * this.tiles.x, this.grid.y * this.tiles.y);
|
|
72
|
+
this.domainMin = new THREE.Vector3(0.2, -0.34, -1.55);
|
|
73
|
+
this.domainMax = new THREE.Vector3(4.9, 1.92, 1.55);
|
|
74
|
+
this.cellSize = new THREE.Vector3();
|
|
75
|
+
this.gridDenominator = new THREE.Vector3(this.grid.x - 1, this.grid.y - 1, this.grid.z - 1);
|
|
76
|
+
this.previousClearColor = new THREE.Color();
|
|
77
|
+
this.kernelRadius = mobile ? 0.125 : 0.105;
|
|
78
|
+
this.sliceLayers = mobile ? [0, 1] : [-1, 0, 1];
|
|
79
|
+
this.target = createFieldTarget(this.atlasSize.x, this.atlasSize.y);
|
|
80
|
+
this.geometry = createSplatGeometry(particleTextureSize, this.sliceLayers);
|
|
81
|
+
this.geometry.setDrawRange(0, this.particleCount * this.sliceLayers.length);
|
|
82
|
+
this.scene = new THREE.Scene();
|
|
83
|
+
this.camera = new THREE.OrthographicCamera(-1, 1, 1, -1, 0, 1);
|
|
84
|
+
this.material = new THREE.ShaderMaterial({
|
|
85
|
+
glslVersion: THREE.GLSL3,
|
|
86
|
+
uniforms: {
|
|
87
|
+
uPosition: { value: null },
|
|
88
|
+
uVelocity: { value: null },
|
|
89
|
+
uDomainMin: { value: this.domainMin },
|
|
90
|
+
uDomainMax: { value: this.domainMax },
|
|
91
|
+
uGrid: { value: this.grid },
|
|
92
|
+
uTiles: { value: this.tiles },
|
|
93
|
+
uAtlasSize: { value: this.atlasSize },
|
|
94
|
+
uKernelRadius: { value: this.kernelRadius },
|
|
95
|
+
},
|
|
96
|
+
vertexShader: /* glsl */ `
|
|
97
|
+
precision highp float;
|
|
98
|
+
uniform sampler2D uPosition;
|
|
99
|
+
uniform sampler2D uVelocity;
|
|
100
|
+
uniform vec3 uDomainMin;
|
|
101
|
+
uniform vec3 uDomainMax;
|
|
102
|
+
uniform vec3 uGrid;
|
|
103
|
+
uniform vec2 uTiles;
|
|
104
|
+
uniform vec2 uAtlasSize;
|
|
105
|
+
uniform float uKernelRadius;
|
|
106
|
+
in vec2 aLookup;
|
|
107
|
+
in float aSliceOffset;
|
|
108
|
+
out vec3 vVelocity;
|
|
109
|
+
out float vSliceDistance;
|
|
110
|
+
out float vAlive;
|
|
111
|
+
|
|
112
|
+
void main() {
|
|
113
|
+
vec4 state = texture(uPosition, aLookup);
|
|
114
|
+
vec3 velocity = texture(uVelocity, aLookup).xyz;
|
|
115
|
+
vec3 normalizedPosition = (state.xyz - uDomainMin) / (uDomainMax - uDomainMin);
|
|
116
|
+
float sliceCoordinate = normalizedPosition.z * (uGrid.z - 1.0);
|
|
117
|
+
float slice = floor(sliceCoordinate) + aSliceOffset;
|
|
118
|
+
bool inDomain = all(greaterThanEqual(normalizedPosition, vec3(0.0)))
|
|
119
|
+
&& all(lessThanEqual(normalizedPosition, vec3(1.0)));
|
|
120
|
+
bool validSlice = slice >= 0.0 && slice < uGrid.z;
|
|
121
|
+
vAlive = step(0.0, state.w) * float(inDomain && validSlice);
|
|
122
|
+
vVelocity = velocity;
|
|
123
|
+
float cellDepth = (uDomainMax.z - uDomainMin.z) / max(uGrid.z - 1.0, 1.0);
|
|
124
|
+
vSliceDistance = (slice - sliceCoordinate) * cellDepth;
|
|
125
|
+
|
|
126
|
+
vec2 tile = vec2(mod(slice, uTiles.x), floor(slice / uTiles.x));
|
|
127
|
+
vec2 localCell = normalizedPosition.xy * (uGrid.xy - 1.0) + vec2(0.5);
|
|
128
|
+
vec2 atlasUv = (tile * uGrid.xy + localCell) / uAtlasSize;
|
|
129
|
+
gl_Position = vAlive > 0.5 ? vec4(atlasUv * 2.0 - 1.0, 0.0, 1.0) : vec4(2.0, 2.0, 2.0, 1.0);
|
|
130
|
+
vec2 cellWorld = (uDomainMax.xy - uDomainMin.xy) / max(uGrid.xy - 1.0, vec2(1.0));
|
|
131
|
+
gl_PointSize = 2.0 * uKernelRadius / max(min(cellWorld.x, cellWorld.y), 0.0001);
|
|
132
|
+
}
|
|
133
|
+
`,
|
|
134
|
+
fragmentShader: /* glsl */ `
|
|
135
|
+
precision highp float;
|
|
136
|
+
uniform float uKernelRadius;
|
|
137
|
+
in vec3 vVelocity;
|
|
138
|
+
in float vSliceDistance;
|
|
139
|
+
in float vAlive;
|
|
140
|
+
layout(location = 0) out vec4 outDensity;
|
|
141
|
+
layout(location = 1) out vec4 outMomentum;
|
|
142
|
+
|
|
143
|
+
void main() {
|
|
144
|
+
if (vAlive < 0.5) discard;
|
|
145
|
+
vec2 radial = gl_PointCoord * 2.0 - 1.0;
|
|
146
|
+
float distanceSquared = dot(radial, radial)
|
|
147
|
+
+ (vSliceDistance * vSliceDistance) / max(uKernelRadius * uKernelRadius, 0.000001);
|
|
148
|
+
if (distanceSquared >= 1.0) discard;
|
|
149
|
+
float kernel = pow(1.0 - distanceSquared, 3.0);
|
|
150
|
+
outDensity = vec4(kernel, 0.0, 0.0, kernel);
|
|
151
|
+
outMomentum = vec4(vVelocity * kernel, kernel);
|
|
152
|
+
}
|
|
153
|
+
`,
|
|
154
|
+
transparent: true,
|
|
155
|
+
depthTest: false,
|
|
156
|
+
depthWrite: false,
|
|
157
|
+
blending: THREE.AdditiveBlending,
|
|
158
|
+
toneMapped: false,
|
|
159
|
+
});
|
|
160
|
+
this.points = new THREE.Points(this.geometry, this.material);
|
|
161
|
+
this.points.frustumCulled = false;
|
|
162
|
+
this.scene.add(this.points);
|
|
163
|
+
this.updateCellSize();
|
|
164
|
+
}
|
|
165
|
+
updateCellSize() {
|
|
166
|
+
this.cellSize.copy(this.domainMax).sub(this.domainMin).divide(this.gridDenominator);
|
|
167
|
+
}
|
|
168
|
+
setDomain(minimum, maximum) {
|
|
169
|
+
this.domainMin.copy(minimum);
|
|
170
|
+
this.domainMax.copy(maximum);
|
|
171
|
+
this.updateCellSize();
|
|
172
|
+
}
|
|
173
|
+
setActiveCount(count) {
|
|
174
|
+
const activeCount = THREE.MathUtils.clamp(Math.floor(count), 1, this.particleCount);
|
|
175
|
+
this.geometry.setDrawRange(0, activeCount * this.sliceLayers.length);
|
|
176
|
+
}
|
|
177
|
+
build(positionTexture, velocityTexture) {
|
|
178
|
+
this.material.uniforms.uPosition.value = positionTexture;
|
|
179
|
+
this.material.uniforms.uVelocity.value = velocityTexture;
|
|
180
|
+
const previousTarget = this.renderer.getRenderTarget();
|
|
181
|
+
const previousColor = this.renderer.getClearColor(this.previousClearColor);
|
|
182
|
+
const previousAlpha = this.renderer.getClearAlpha();
|
|
183
|
+
const previousAutoClear = this.renderer.autoClear;
|
|
184
|
+
this.renderer.autoClear = true;
|
|
185
|
+
this.renderer.setClearColor(0x000000, 0);
|
|
186
|
+
this.renderer.setRenderTarget(this.target);
|
|
187
|
+
this.renderer.clear(true, false, false);
|
|
188
|
+
this.renderer.render(this.scene, this.camera);
|
|
189
|
+
this.renderer.setRenderTarget(previousTarget);
|
|
190
|
+
this.renderer.setClearColor(previousColor, previousAlpha);
|
|
191
|
+
this.renderer.autoClear = previousAutoClear;
|
|
192
|
+
}
|
|
193
|
+
get densityTexture() {
|
|
194
|
+
return this.target.textures[0];
|
|
195
|
+
}
|
|
196
|
+
get momentumTexture() {
|
|
197
|
+
return this.target.textures[1];
|
|
198
|
+
}
|
|
199
|
+
dispose() {
|
|
200
|
+
this.target.dispose();
|
|
201
|
+
this.geometry.dispose();
|
|
202
|
+
this.material.dispose();
|
|
203
|
+
}
|
|
204
|
+
}
|