@newkrok/three-particles 2.6.3 → 2.6.4
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/dist/index.d.ts +1782 -7
- package/dist/index.js +1578 -6
- package/dist/index.js.map +1 -0
- package/dist/three-particles.min.js +1 -2
- package/dist/three-particles.min.js.map +1 -0
- package/package.json +5 -7
- package/dist/bundle-report.json +0 -1
- package/dist/index.d.ts.map +0 -1
- package/dist/js/effects/three-particles/index.d.ts +0 -7
- package/dist/js/effects/three-particles/index.d.ts.map +0 -1
- package/dist/js/effects/three-particles/index.js +0 -6
- package/dist/js/effects/three-particles/shaders/particle-system-fragment-shader.glsl.d.ts +0 -3
- package/dist/js/effects/three-particles/shaders/particle-system-fragment-shader.glsl.d.ts.map +0 -1
- package/dist/js/effects/three-particles/shaders/particle-system-fragment-shader.glsl.js +0 -71
- package/dist/js/effects/three-particles/shaders/particle-system-vertex-shader.glsl.d.ts +0 -3
- package/dist/js/effects/three-particles/shaders/particle-system-vertex-shader.glsl.d.ts.map +0 -1
- package/dist/js/effects/three-particles/shaders/particle-system-vertex-shader.glsl.js +0 -37
- package/dist/js/effects/three-particles/three-particles-bezier.d.ts +0 -5
- package/dist/js/effects/three-particles/three-particles-bezier.d.ts.map +0 -1
- package/dist/js/effects/three-particles/three-particles-bezier.js +0 -62
- package/dist/js/effects/three-particles/three-particles-curves.d.ts +0 -108
- package/dist/js/effects/three-particles/three-particles-curves.d.ts.map +0 -1
- package/dist/js/effects/three-particles/three-particles-curves.js +0 -62
- package/dist/js/effects/three-particles/three-particles-enums.d.ts +0 -115
- package/dist/js/effects/three-particles/three-particles-enums.d.ts.map +0 -1
- package/dist/js/effects/three-particles/three-particles-enums.js +0 -1
- package/dist/js/effects/three-particles/three-particles-modifiers.d.ts +0 -73
- package/dist/js/effects/three-particles/three-particles-modifiers.d.ts.map +0 -1
- package/dist/js/effects/three-particles/three-particles-modifiers.js +0 -168
- package/dist/js/effects/three-particles/three-particles-utils.d.ts +0 -159
- package/dist/js/effects/three-particles/three-particles-utils.d.ts.map +0 -1
- package/dist/js/effects/three-particles/three-particles-utils.js +0 -302
- package/dist/js/effects/three-particles/three-particles.d.ts +0 -107
- package/dist/js/effects/three-particles/three-particles.d.ts.map +0 -1
- package/dist/js/effects/three-particles/three-particles.js +0 -972
- package/dist/js/effects/three-particles/types.d.ts +0 -1223
- package/dist/js/effects/three-particles/types.d.ts.map +0 -1
- package/dist/js/effects/three-particles/types.js +0 -1
- package/dist/three-particles.min.js.LICENSE.txt +0 -6
package/dist/index.d.ts
CHANGED
|
@@ -1,7 +1,1782 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
1
|
+
import * as THREE from 'three';
|
|
2
|
+
import { Gyroscope } from 'three/examples/jsm/misc/Gyroscope.js';
|
|
3
|
+
import { FBM } from 'three-noise/build/three-noise.module.js';
|
|
4
|
+
|
|
5
|
+
/**
|
|
6
|
+
* Defines the coordinate space in which particles are simulated.
|
|
7
|
+
*
|
|
8
|
+
* @enum {string}
|
|
9
|
+
*/
|
|
10
|
+
declare const enum SimulationSpace {
|
|
11
|
+
/**
|
|
12
|
+
* Particles move relative to the emitter's local coordinate system.
|
|
13
|
+
* When the emitter moves or rotates, particles move with it.
|
|
14
|
+
* Ideal for effects attached to moving objects (e.g., engine trails, character auras).
|
|
15
|
+
*/
|
|
16
|
+
LOCAL = "LOCAL",
|
|
17
|
+
/**
|
|
18
|
+
* Particles move in world space and are independent of the emitter's transform.
|
|
19
|
+
* Once emitted, particles remain stationary or move according to their velocity in world coordinates.
|
|
20
|
+
* Ideal for environmental effects (e.g., smoke, explosions, ambient particles).
|
|
21
|
+
*/
|
|
22
|
+
WORLD = "WORLD"
|
|
23
|
+
}
|
|
24
|
+
/**
|
|
25
|
+
* Defines the geometric shape from which particles are emitted.
|
|
26
|
+
*
|
|
27
|
+
* @enum {string}
|
|
28
|
+
*/
|
|
29
|
+
declare const enum Shape {
|
|
30
|
+
/**
|
|
31
|
+
* Emit particles from a spherical volume or shell.
|
|
32
|
+
* Configure with {@link Sphere} properties (radius, arc, radiusThickness).
|
|
33
|
+
*/
|
|
34
|
+
SPHERE = "SPHERE",
|
|
35
|
+
/**
|
|
36
|
+
* Emit particles from a conical volume or shell.
|
|
37
|
+
* Configure with {@link Cone} properties (angle, radius, arc, radiusThickness).
|
|
38
|
+
* Useful for directional effects like fire, smoke plumes, or spray effects.
|
|
39
|
+
*/
|
|
40
|
+
CONE = "CONE",
|
|
41
|
+
/**
|
|
42
|
+
* Emit particles from a box volume, shell, or edges.
|
|
43
|
+
* Configure with {@link Box} properties (scale, emitFrom).
|
|
44
|
+
* Useful for area-based effects like dust clouds or rain.
|
|
45
|
+
*/
|
|
46
|
+
BOX = "BOX",
|
|
47
|
+
/**
|
|
48
|
+
* Emit particles from a circular area or edge.
|
|
49
|
+
* Configure with {@link Circle} properties (radius, arc, radiusThickness).
|
|
50
|
+
* Useful for ground impacts, rings, or radial effects.
|
|
51
|
+
*/
|
|
52
|
+
CIRCLE = "CIRCLE",
|
|
53
|
+
/**
|
|
54
|
+
* Emit particles from a rectangular area.
|
|
55
|
+
* Configure with {@link Rectangle} properties (scale, rotation).
|
|
56
|
+
* Useful for planar effects like rain on a surface or screen effects.
|
|
57
|
+
*/
|
|
58
|
+
RECTANGLE = "RECTANGLE"
|
|
59
|
+
}
|
|
60
|
+
/**
|
|
61
|
+
* Defines where on a shape particles are emitted from.
|
|
62
|
+
* Not all shapes support all emit modes.
|
|
63
|
+
*
|
|
64
|
+
* @enum {string}
|
|
65
|
+
*/
|
|
66
|
+
declare const enum EmitFrom {
|
|
67
|
+
/**
|
|
68
|
+
* Emit particles from random positions within the entire volume of the shape.
|
|
69
|
+
* Supported by: SPHERE, CONE, BOX.
|
|
70
|
+
*/
|
|
71
|
+
VOLUME = "VOLUME",
|
|
72
|
+
/**
|
|
73
|
+
* Emit particles from the surface/shell of the shape.
|
|
74
|
+
* Supported by: SPHERE, CONE, BOX.
|
|
75
|
+
*/
|
|
76
|
+
SHELL = "SHELL",
|
|
77
|
+
/**
|
|
78
|
+
* Emit particles from the edges of the shape.
|
|
79
|
+
* Supported by: BOX.
|
|
80
|
+
*/
|
|
81
|
+
EDGE = "EDGE"
|
|
82
|
+
}
|
|
83
|
+
/**
|
|
84
|
+
* Defines how texture sheet animation is timed.
|
|
85
|
+
*
|
|
86
|
+
* @enum {string}
|
|
87
|
+
*/
|
|
88
|
+
declare const enum TimeMode {
|
|
89
|
+
/**
|
|
90
|
+
* Animation frames are based on the particle's lifetime percentage.
|
|
91
|
+
* The animation completes once over the particle's lifetime.
|
|
92
|
+
*/
|
|
93
|
+
LIFETIME = "LIFETIME",
|
|
94
|
+
/**
|
|
95
|
+
* Animation frames are based on frames per second (FPS).
|
|
96
|
+
* The animation runs at a fixed speed regardless of particle lifetime.
|
|
97
|
+
*/
|
|
98
|
+
FPS = "FPS"
|
|
99
|
+
}
|
|
100
|
+
/**
|
|
101
|
+
* Defines the type of curve function used for animating values over a particle's lifetime.
|
|
102
|
+
*
|
|
103
|
+
* @enum {string}
|
|
104
|
+
*/
|
|
105
|
+
declare const enum LifeTimeCurve {
|
|
106
|
+
/**
|
|
107
|
+
* Use custom Bezier curves with control points.
|
|
108
|
+
* Provides maximum control over the animation curve shape.
|
|
109
|
+
* See {@link BezierCurve} for configuration.
|
|
110
|
+
*/
|
|
111
|
+
BEZIER = "BEZIER",
|
|
112
|
+
/**
|
|
113
|
+
* Use predefined easing functions (e.g., easeInQuad, easeOutCubic).
|
|
114
|
+
* Convenient for common animation patterns.
|
|
115
|
+
* See {@link EasingCurve} and {@link CurveFunctionId} for available functions.
|
|
116
|
+
*/
|
|
117
|
+
EASING = "EASING"
|
|
118
|
+
}
|
|
119
|
+
|
|
120
|
+
/**
|
|
121
|
+
* A fixed numerical value.
|
|
122
|
+
* Used for properties that require a constant value.
|
|
123
|
+
*
|
|
124
|
+
* @example
|
|
125
|
+
* const delay: Constant = 2; // Fixed delay of 2 seconds.
|
|
126
|
+
*/
|
|
127
|
+
type Constant = number;
|
|
128
|
+
/**
|
|
129
|
+
* An object that defines a range for random number generation.
|
|
130
|
+
* Contains `min` and `max` properties.
|
|
131
|
+
*
|
|
132
|
+
* @property min - The minimum value for the random range.
|
|
133
|
+
* @property max - The maximum value for the random range.
|
|
134
|
+
*
|
|
135
|
+
* @example
|
|
136
|
+
* const randomDelay: RandomBetweenTwoConstants = { min: 0.5, max: 2 }; // Random delay between 0.5 and 2 seconds.
|
|
137
|
+
*/
|
|
138
|
+
type RandomBetweenTwoConstants = {
|
|
139
|
+
min?: number;
|
|
140
|
+
max?: number;
|
|
141
|
+
};
|
|
142
|
+
/**
|
|
143
|
+
* Base type for curves, containing common properties.
|
|
144
|
+
* @property scale - A scaling factor for the curve.
|
|
145
|
+
*/
|
|
146
|
+
type CurveBase = {
|
|
147
|
+
scale?: number;
|
|
148
|
+
};
|
|
149
|
+
/**
|
|
150
|
+
* A function that defines how the value changes over time.
|
|
151
|
+
* @param time - A normalized value between 0 and 1 representing the progress of the curve.
|
|
152
|
+
* @returns The corresponding value based on the curve function.
|
|
153
|
+
*/
|
|
154
|
+
type CurveFunction = (time: number) => number;
|
|
155
|
+
/**
|
|
156
|
+
* A Bézier curve point representing a control point.
|
|
157
|
+
* @property x - The time (normalized between 0 and 1).
|
|
158
|
+
* @property y - The value at that point.
|
|
159
|
+
* @property percentage - (Optional) Normalized position within the curve (for additional flexibility).
|
|
160
|
+
*/
|
|
161
|
+
type BezierPoint = {
|
|
162
|
+
x: number;
|
|
163
|
+
y: number;
|
|
164
|
+
percentage?: number;
|
|
165
|
+
};
|
|
166
|
+
/**
|
|
167
|
+
* A Bézier curve representation for controlling particle properties.
|
|
168
|
+
* @property type - Specifies that this curve is of type `bezier`.
|
|
169
|
+
* @property bezierPoints - An array of control points defining the Bézier curve.
|
|
170
|
+
* @example
|
|
171
|
+
* {
|
|
172
|
+
* type: LifeTimeCurve.BEZIER,
|
|
173
|
+
* bezierPoints: [
|
|
174
|
+
* { x: 0, y: 0.275, percentage: 0 },
|
|
175
|
+
* { x: 0.1666, y: 0.4416 },
|
|
176
|
+
* { x: 0.5066, y: 0.495, percentage: 0.5066 },
|
|
177
|
+
* { x: 1, y: 1, percentage: 1 }
|
|
178
|
+
* ]
|
|
179
|
+
* }
|
|
180
|
+
*/
|
|
181
|
+
type BezierCurve = CurveBase & {
|
|
182
|
+
type: LifeTimeCurve.BEZIER;
|
|
183
|
+
bezierPoints: Array<BezierPoint>;
|
|
184
|
+
};
|
|
185
|
+
/**
|
|
186
|
+
* An easing curve representation using a custom function.
|
|
187
|
+
* @property type - Specifies that this curve is of type `easing`.
|
|
188
|
+
* @property curveFunction - A function defining how the value changes over time.
|
|
189
|
+
* @example
|
|
190
|
+
* {
|
|
191
|
+
* type: LifeTimeCurve.EASING,
|
|
192
|
+
* curveFunction: (time) => Math.sin(time * Math.PI) // Simple easing function
|
|
193
|
+
* }
|
|
194
|
+
*/
|
|
195
|
+
type EasingCurve = CurveBase & {
|
|
196
|
+
type: LifeTimeCurve.EASING;
|
|
197
|
+
curveFunction: CurveFunction;
|
|
198
|
+
};
|
|
199
|
+
/**
|
|
200
|
+
* A flexible curve representation that supports Bézier curves and easing functions.
|
|
201
|
+
*/
|
|
202
|
+
type LifetimeCurve = BezierCurve | EasingCurve;
|
|
203
|
+
/**
|
|
204
|
+
* Represents a point in 3D space with optional x, y, and z coordinates.
|
|
205
|
+
* Each coordinate is a number and is optional, allowing for partial definitions.
|
|
206
|
+
*
|
|
207
|
+
* @example
|
|
208
|
+
* // A point with all coordinates defined
|
|
209
|
+
* const point: Point3D = { x: 10, y: 20, z: 30 };
|
|
210
|
+
*
|
|
211
|
+
* @example
|
|
212
|
+
* // A point with only one coordinate defined
|
|
213
|
+
* const point: Point3D = { x: 10 };
|
|
214
|
+
*
|
|
215
|
+
* @default
|
|
216
|
+
* // Default values are undefined for all coordinates.
|
|
217
|
+
* const point: Point3D = {};
|
|
218
|
+
*/
|
|
219
|
+
type Point3D = {
|
|
220
|
+
x?: number;
|
|
221
|
+
y?: number;
|
|
222
|
+
z?: number;
|
|
223
|
+
};
|
|
224
|
+
/**
|
|
225
|
+
* Represents a transform in 3D space, including position, rotation, and scale.
|
|
226
|
+
* Each property is optional and represented as a THREE.Vector3 instance.
|
|
227
|
+
*
|
|
228
|
+
* - `position`: Defines the translation of an object in 3D space.
|
|
229
|
+
* - `rotation`: Defines the rotation of an object in radians for each axis (x, y, z).
|
|
230
|
+
* - `scale`: Defines the scale of an object along each axis.
|
|
231
|
+
*
|
|
232
|
+
* @example
|
|
233
|
+
* // A transform with all properties defined
|
|
234
|
+
* const transform: Transform = {
|
|
235
|
+
* position: new THREE.Vector3(10, 20, 30),
|
|
236
|
+
* rotation: new THREE.Vector3(Math.PI / 2, 0, 0),
|
|
237
|
+
* scale: new THREE.Vector3(1, 1, 1),
|
|
238
|
+
* };
|
|
239
|
+
*
|
|
240
|
+
* @example
|
|
241
|
+
* // A transform with only position defined
|
|
242
|
+
* const transform: Transform = {
|
|
243
|
+
* position: new THREE.Vector3(5, 5, 5),
|
|
244
|
+
* };
|
|
245
|
+
*
|
|
246
|
+
* @default
|
|
247
|
+
* // Default values are undefined for all properties.
|
|
248
|
+
* const transform: Transform = {};
|
|
249
|
+
*/
|
|
250
|
+
type Transform = {
|
|
251
|
+
position?: THREE.Vector3;
|
|
252
|
+
rotation?: THREE.Vector3;
|
|
253
|
+
scale?: THREE.Vector3;
|
|
254
|
+
};
|
|
255
|
+
/**
|
|
256
|
+
* Represents an RGB color with normalized values (0.0 to 1.0).
|
|
257
|
+
*
|
|
258
|
+
* @example
|
|
259
|
+
* ```typescript
|
|
260
|
+
* // Pure red
|
|
261
|
+
* const red: Rgb = { r: 1.0, g: 0.0, b: 0.0 };
|
|
262
|
+
*
|
|
263
|
+
* // Pure white
|
|
264
|
+
* const white: Rgb = { r: 1.0, g: 1.0, b: 1.0 };
|
|
265
|
+
*
|
|
266
|
+
* // Orange
|
|
267
|
+
* const orange: Rgb = { r: 1.0, g: 0.5, b: 0.0 };
|
|
268
|
+
* ```
|
|
269
|
+
*/
|
|
270
|
+
type Rgb = {
|
|
271
|
+
/** Red channel (0.0 to 1.0) */
|
|
272
|
+
r?: number;
|
|
273
|
+
/** Green channel (0.0 to 1.0) */
|
|
274
|
+
g?: number;
|
|
275
|
+
/** Blue channel (0.0 to 1.0) */
|
|
276
|
+
b?: number;
|
|
277
|
+
};
|
|
278
|
+
/**
|
|
279
|
+
* Defines a color range for random particle colors.
|
|
280
|
+
* Each particle will receive a random color between min and max on emission.
|
|
281
|
+
*
|
|
282
|
+
* @example
|
|
283
|
+
* ```typescript
|
|
284
|
+
* // Random colors between red and yellow
|
|
285
|
+
* const fireColors: MinMaxColor = {
|
|
286
|
+
* min: { r: 1.0, g: 0.0, b: 0.0 }, // Red
|
|
287
|
+
* max: { r: 1.0, g: 1.0, b: 0.0 } // Yellow
|
|
288
|
+
* };
|
|
289
|
+
*
|
|
290
|
+
* // Fixed white color (no randomness)
|
|
291
|
+
* const white: MinMaxColor = {
|
|
292
|
+
* min: { r: 1.0, g: 1.0, b: 1.0 },
|
|
293
|
+
* max: { r: 1.0, g: 1.0, b: 1.0 }
|
|
294
|
+
* };
|
|
295
|
+
* ```
|
|
296
|
+
*/
|
|
297
|
+
type MinMaxColor = {
|
|
298
|
+
/** Minimum color values (lower bound for random selection) */
|
|
299
|
+
min?: Rgb;
|
|
300
|
+
/** Maximum color values (upper bound for random selection) */
|
|
301
|
+
max?: Rgb;
|
|
302
|
+
};
|
|
303
|
+
/**
|
|
304
|
+
* Defines a burst emission event that emits a specific number of particles at a given time.
|
|
305
|
+
* Bursts are useful for explosions, impacts, fireworks, and other instantaneous particle effects.
|
|
306
|
+
*
|
|
307
|
+
* @property time - The time (in seconds) after the particle system starts when this burst should occur.
|
|
308
|
+
* @property count - The number of particles to emit. Can be a constant or a random range.
|
|
309
|
+
* @property cycles - The number of times this burst should repeat. Defaults to 1 (single burst).
|
|
310
|
+
* @property interval - The time interval (in seconds) between burst cycles. Only used when cycles > 1.
|
|
311
|
+
* @property probability - The probability (0.0 to 1.0) that this burst will occur. Defaults to 1.0.
|
|
312
|
+
*
|
|
313
|
+
* @example
|
|
314
|
+
* // Simple burst at start
|
|
315
|
+
* { time: 0, count: 50 }
|
|
316
|
+
*
|
|
317
|
+
* // Random count burst at 1 second
|
|
318
|
+
* { time: 1, count: { min: 20, max: 30 } }
|
|
319
|
+
*
|
|
320
|
+
* // Repeating burst with interval
|
|
321
|
+
* { time: 0.5, count: 10, cycles: 3, interval: 0.2 }
|
|
322
|
+
* // Emits at 0.5s, 0.7s, 0.9s
|
|
323
|
+
*
|
|
324
|
+
* // Probabilistic burst (50% chance)
|
|
325
|
+
* { time: 2, count: 100, probability: 0.5 }
|
|
326
|
+
*/
|
|
327
|
+
type Burst = {
|
|
328
|
+
/** Time in seconds when the burst should occur */
|
|
329
|
+
time: number;
|
|
330
|
+
/** Number of particles to emit (constant or random range) */
|
|
331
|
+
count: Constant | RandomBetweenTwoConstants;
|
|
332
|
+
/** Number of times to repeat this burst. Defaults to 1. */
|
|
333
|
+
cycles?: number;
|
|
334
|
+
/** Time interval in seconds between burst cycles. Defaults to 0. */
|
|
335
|
+
interval?: number;
|
|
336
|
+
/** Probability (0-1) that this burst will occur. Defaults to 1. */
|
|
337
|
+
probability?: number;
|
|
338
|
+
};
|
|
339
|
+
/**
|
|
340
|
+
* Defines the emission behavior of the particles.
|
|
341
|
+
* Supports rates defined over time or distance using constant values, random ranges, or curves (Bézier or easing).
|
|
342
|
+
* Also supports burst emissions for instantaneous particle effects.
|
|
343
|
+
*
|
|
344
|
+
* @default
|
|
345
|
+
* rateOverTime: 10.0
|
|
346
|
+
* rateOverDistance: 0.0
|
|
347
|
+
* bursts: []
|
|
348
|
+
*
|
|
349
|
+
* @example
|
|
350
|
+
* // Rate over time as a constant value
|
|
351
|
+
* rateOverTime: 10;
|
|
352
|
+
*
|
|
353
|
+
* // Rate over time as a random range
|
|
354
|
+
* rateOverTime: { min: 5, max: 15 };
|
|
355
|
+
*
|
|
356
|
+
* // Rate over time using a Bézier curve
|
|
357
|
+
* rateOverTime: {
|
|
358
|
+
* type: 'bezier',
|
|
359
|
+
* bezierPoints: [
|
|
360
|
+
* { x: 0, y: 0, percentage: 0 },
|
|
361
|
+
* { x: 0.5, y: 50 },
|
|
362
|
+
* { x: 1, y: 100, percentage: 1 }
|
|
363
|
+
* ],
|
|
364
|
+
* scale: 1
|
|
365
|
+
* };
|
|
366
|
+
*
|
|
367
|
+
* // Rate over distance as a constant value
|
|
368
|
+
* rateOverDistance: 2;
|
|
369
|
+
*
|
|
370
|
+
* // Rate over distance as a random range
|
|
371
|
+
* rateOverDistance: { min: 1, max: 3 };
|
|
372
|
+
*
|
|
373
|
+
* // Rate over distance using an easing curve
|
|
374
|
+
* rateOverDistance: {
|
|
375
|
+
* type: 'easing',
|
|
376
|
+
* curveFunction: (distance) => Math.sin(distance),
|
|
377
|
+
* scale: 0.5
|
|
378
|
+
* };
|
|
379
|
+
*
|
|
380
|
+
* // Burst emissions for explosions
|
|
381
|
+
* bursts: [
|
|
382
|
+
* { time: 0, count: 50 },
|
|
383
|
+
* { time: 1, count: { min: 20, max: 30 }, probability: 0.8 },
|
|
384
|
+
* { time: 0.5, count: 10, cycles: 3, interval: 0.2 }
|
|
385
|
+
* ];
|
|
386
|
+
*/
|
|
387
|
+
type Emission = {
|
|
388
|
+
rateOverTime?: Constant | RandomBetweenTwoConstants | LifetimeCurve;
|
|
389
|
+
rateOverDistance?: Constant | RandomBetweenTwoConstants | LifetimeCurve;
|
|
390
|
+
/** Array of burst configurations for instantaneous particle emissions */
|
|
391
|
+
bursts?: Array<Burst>;
|
|
392
|
+
};
|
|
393
|
+
/**
|
|
394
|
+
* Configuration for a sphere shape used in particle systems.
|
|
395
|
+
*
|
|
396
|
+
* @property radius - The radius of the sphere.
|
|
397
|
+
* @property radiusThickness - The thickness of the sphere's shell (0 to 1, where 1 is solid).
|
|
398
|
+
* @property arc - The angular arc of the sphere (in radians).
|
|
399
|
+
*
|
|
400
|
+
* @example
|
|
401
|
+
* const sphere: Sphere = {
|
|
402
|
+
* radius: 5,
|
|
403
|
+
* radiusThickness: 0.8,
|
|
404
|
+
* arc: Math.PI,
|
|
405
|
+
* };
|
|
406
|
+
*/
|
|
407
|
+
type Sphere = {
|
|
408
|
+
radius?: number;
|
|
409
|
+
radiusThickness?: number;
|
|
410
|
+
arc?: number;
|
|
411
|
+
};
|
|
412
|
+
/**
|
|
413
|
+
* Configuration for a cone shape used in particle systems.
|
|
414
|
+
*
|
|
415
|
+
* @property angle - The angle of the cone (in radians).
|
|
416
|
+
* @property radius - The radius of the cone's base.
|
|
417
|
+
* @property radiusThickness - The thickness of the cone's base (0 to 1, where 1 is solid).
|
|
418
|
+
* @property arc - The angular arc of the cone's base (in radians).
|
|
419
|
+
*
|
|
420
|
+
* @example
|
|
421
|
+
* const cone: Cone = {
|
|
422
|
+
* angle: Math.PI / 4,
|
|
423
|
+
* radius: 10,
|
|
424
|
+
* radiusThickness: 0.5,
|
|
425
|
+
* arc: Math.PI * 2,
|
|
426
|
+
* };
|
|
427
|
+
*/
|
|
428
|
+
type Cone = {
|
|
429
|
+
angle?: number;
|
|
430
|
+
radius?: number;
|
|
431
|
+
radiusThickness?: number;
|
|
432
|
+
arc?: number;
|
|
433
|
+
};
|
|
434
|
+
/**
|
|
435
|
+
* Configuration for a circle shape used in particle systems.
|
|
436
|
+
*
|
|
437
|
+
* @property radius - The radius of the circle.
|
|
438
|
+
* @property radiusThickness - The thickness of the circle's shell (0 to 1, where 1 is solid).
|
|
439
|
+
* @property arc - The angular arc of the circle (in radians).
|
|
440
|
+
*
|
|
441
|
+
* @example
|
|
442
|
+
* const circle: Circle = {
|
|
443
|
+
* radius: 10,
|
|
444
|
+
* radiusThickness: 0.5,
|
|
445
|
+
* arc: Math.PI,
|
|
446
|
+
* };
|
|
447
|
+
*/
|
|
448
|
+
type Circle = {
|
|
449
|
+
radius?: number;
|
|
450
|
+
radiusThickness?: number;
|
|
451
|
+
arc?: number;
|
|
452
|
+
};
|
|
453
|
+
/**
|
|
454
|
+
* Configuration for a rectangle shape used in particle systems.
|
|
455
|
+
*
|
|
456
|
+
* @property rotation - The rotation of the rectangle as a 3D point (in radians for each axis).
|
|
457
|
+
* @property scale - The scale of the rectangle as a 3D point.
|
|
458
|
+
*
|
|
459
|
+
* @example
|
|
460
|
+
* const rectangle: Rectangle = {
|
|
461
|
+
* rotation: { x: Math.PI / 4, y: 0, z: 0 },
|
|
462
|
+
* scale: { x: 10, y: 5, z: 1 },
|
|
463
|
+
* };
|
|
464
|
+
*/
|
|
465
|
+
type Rectangle = {
|
|
466
|
+
rotation?: Point3D;
|
|
467
|
+
scale?: Point3D;
|
|
468
|
+
};
|
|
469
|
+
/**
|
|
470
|
+
* Configuration for a box shape used in particle systems.
|
|
471
|
+
*
|
|
472
|
+
* @property scale - The scale of the box as a 3D point.
|
|
473
|
+
* @property emitFrom - Specifies where particles are emitted from within the box.
|
|
474
|
+
*
|
|
475
|
+
* @example
|
|
476
|
+
* const box: Box = {
|
|
477
|
+
* scale: { x: 10, y: 10, z: 10 },
|
|
478
|
+
* emitFrom: EmitFrom.EDGE,
|
|
479
|
+
* };
|
|
480
|
+
*/
|
|
481
|
+
type Box = {
|
|
482
|
+
scale?: Point3D;
|
|
483
|
+
emitFrom?: EmitFrom;
|
|
484
|
+
};
|
|
485
|
+
/**
|
|
486
|
+
* Configuration for defining a 3D shape used in particle systems.
|
|
487
|
+
* Specifies the shape type and its parameters, including spheres, cones, circles, rectangles, and boxes.
|
|
488
|
+
*
|
|
489
|
+
* @property shape - The type of the shape to be used.
|
|
490
|
+
* @property sphere - Configuration for a sphere shape.
|
|
491
|
+
* @property cone - Configuration for a cone shape.
|
|
492
|
+
* @property circle - Configuration for a circle shape.
|
|
493
|
+
* @property rectangle - Configuration for a rectangle shape.
|
|
494
|
+
* @property box - Configuration for a box shape.
|
|
495
|
+
*
|
|
496
|
+
* @example
|
|
497
|
+
* const shapeConfig: ShapeConfig = {
|
|
498
|
+
* shape: Shape.SPHERE,
|
|
499
|
+
* sphere: {
|
|
500
|
+
* radius: 5,
|
|
501
|
+
* radiusThickness: 0.8,
|
|
502
|
+
* arc: Math.PI,
|
|
503
|
+
* },
|
|
504
|
+
* };
|
|
505
|
+
*/
|
|
506
|
+
type ShapeConfig = {
|
|
507
|
+
shape?: Shape;
|
|
508
|
+
sphere?: Sphere;
|
|
509
|
+
cone?: Cone;
|
|
510
|
+
circle?: Circle;
|
|
511
|
+
rectangle?: Rectangle;
|
|
512
|
+
box?: Box;
|
|
513
|
+
};
|
|
514
|
+
/**
|
|
515
|
+
* Defines the texture sheet animation settings for particles.
|
|
516
|
+
* Allows configuring the animation frames, timing mode, frames per second, and the starting frame.
|
|
517
|
+
*
|
|
518
|
+
* @default
|
|
519
|
+
* tiles: new THREE.Vector2(1.0, 1.0)
|
|
520
|
+
* timeMode: TimeMode.LIFETIME
|
|
521
|
+
* fps: 30.0
|
|
522
|
+
* startFrame: 0
|
|
523
|
+
*
|
|
524
|
+
* @example
|
|
525
|
+
* // Basic configuration with default values
|
|
526
|
+
* textureSheetAnimation: {
|
|
527
|
+
* tiles: new THREE.Vector2(1.0, 1.0),
|
|
528
|
+
* timeMode: TimeMode.LIFETIME,
|
|
529
|
+
* fps: 30.0,
|
|
530
|
+
* startFrame: 0
|
|
531
|
+
* };
|
|
532
|
+
*
|
|
533
|
+
* // Custom configuration
|
|
534
|
+
* textureSheetAnimation: {
|
|
535
|
+
* tiles: new THREE.Vector2(4, 4), // 4x4 grid of animation tiles
|
|
536
|
+
* timeMode: TimeMode.SPEED,
|
|
537
|
+
* fps: 60.0,
|
|
538
|
+
* startFrame: { min: 0, max: 15 } // Random start frame between 0 and 15
|
|
539
|
+
* };
|
|
540
|
+
*/
|
|
541
|
+
type TextureSheetAnimation = {
|
|
542
|
+
tiles?: THREE.Vector2;
|
|
543
|
+
timeMode?: TimeMode;
|
|
544
|
+
fps?: number;
|
|
545
|
+
startFrame?: Constant | RandomBetweenTwoConstants;
|
|
546
|
+
};
|
|
547
|
+
/**
|
|
548
|
+
* Configuration for the particle system renderer, controlling blending, transparency, depth, and background color behavior.
|
|
549
|
+
*
|
|
550
|
+
* @property blending - Defines the blending mode for the particle system (e.g., additive blending).
|
|
551
|
+
* @property discardBackgroundColor - Whether to discard particles that match the background color.
|
|
552
|
+
* @property backgroundColorTolerance - The tolerance for matching the background color when `discardBackgroundColor` is true.
|
|
553
|
+
* @property backgroundColor - The background color as an RGB value, used when `discardBackgroundColor` is enabled.
|
|
554
|
+
* @property transparent - Whether the particle system uses transparency.
|
|
555
|
+
* @property depthTest - Whether to enable depth testing for particles (determines if particles are rendered behind or in front of other objects).
|
|
556
|
+
* @property depthWrite - Whether to write depth information for the particles (affects sorting and rendering order).
|
|
557
|
+
*
|
|
558
|
+
* @example
|
|
559
|
+
* // A renderer configuration with additive blending and transparent particles
|
|
560
|
+
* const renderer: Renderer = {
|
|
561
|
+
* blending: THREE.AdditiveBlending,
|
|
562
|
+
* discardBackgroundColor: true,
|
|
563
|
+
* backgroundColorTolerance: 0.1,
|
|
564
|
+
* backgroundColor: { r: 0, g: 0, b: 0 },
|
|
565
|
+
* transparent: true,
|
|
566
|
+
* depthTest: true,
|
|
567
|
+
* depthWrite: false,
|
|
568
|
+
* };
|
|
569
|
+
*
|
|
570
|
+
* @default
|
|
571
|
+
* // Default values for the renderer configuration
|
|
572
|
+
* const renderer: Renderer = {
|
|
573
|
+
* blending: THREE.NormalBlending,
|
|
574
|
+
* discardBackgroundColor: false,
|
|
575
|
+
* backgroundColorTolerance: 1.0,
|
|
576
|
+
* backgroundColor: { r: 0, g: 0, b: 0 },
|
|
577
|
+
* transparent: false,
|
|
578
|
+
* depthTest: true,
|
|
579
|
+
* depthWrite: true,
|
|
580
|
+
* };
|
|
581
|
+
*/
|
|
582
|
+
type Renderer = {
|
|
583
|
+
blending: THREE.Blending;
|
|
584
|
+
discardBackgroundColor: boolean;
|
|
585
|
+
backgroundColorTolerance: number;
|
|
586
|
+
backgroundColor: Rgb;
|
|
587
|
+
transparent: boolean;
|
|
588
|
+
depthTest: boolean;
|
|
589
|
+
depthWrite: boolean;
|
|
590
|
+
};
|
|
591
|
+
/**
|
|
592
|
+
* Configuration for noise effects applied to particles in a particle system.
|
|
593
|
+
* Noise can affect particle position, rotation, and size dynamically.
|
|
594
|
+
*
|
|
595
|
+
* @property isActive - Whether noise is enabled for the particle system.
|
|
596
|
+
* @property strength - The overall strength of the noise effect.
|
|
597
|
+
* @property positionAmount - The amount of noise applied to particle positions.
|
|
598
|
+
* @property rotationAmount - The amount of noise applied to particle rotations.
|
|
599
|
+
* @property sizeAmount - The amount of noise applied to particle sizes.
|
|
600
|
+
* @property sampler - An optional noise sampler (e.g., FBM for fractal Brownian motion) to generate noise values.
|
|
601
|
+
* @property offsets - An optional array of offsets to randomize noise generation per particle.
|
|
602
|
+
*
|
|
603
|
+
* @example
|
|
604
|
+
* // A noise configuration with position and rotation noise
|
|
605
|
+
* const noise: Noise = {
|
|
606
|
+
* isActive: true,
|
|
607
|
+
* strength: 0.5,
|
|
608
|
+
* positionAmount: 1.0,
|
|
609
|
+
* rotationAmount: 0.3,
|
|
610
|
+
* sizeAmount: 0.0,
|
|
611
|
+
* sampler: new FBM(),
|
|
612
|
+
* offsets: [0.1, 0.2, 0.3],
|
|
613
|
+
* };
|
|
614
|
+
*
|
|
615
|
+
* @default
|
|
616
|
+
* // Default values for noise configuration
|
|
617
|
+
* const noise: Noise = {
|
|
618
|
+
* isActive: false,
|
|
619
|
+
* strength: 1.0,
|
|
620
|
+
* positionAmount: 0.0,
|
|
621
|
+
* rotationAmount: 0.0,
|
|
622
|
+
* sizeAmount: 0.0,
|
|
623
|
+
* sampler: undefined,
|
|
624
|
+
* offsets: undefined,
|
|
625
|
+
* };
|
|
626
|
+
*/
|
|
627
|
+
type Noise = {
|
|
628
|
+
isActive: boolean;
|
|
629
|
+
strength: number;
|
|
630
|
+
noisePower: number;
|
|
631
|
+
positionAmount: number;
|
|
632
|
+
rotationAmount: number;
|
|
633
|
+
sizeAmount: number;
|
|
634
|
+
sampler?: FBM;
|
|
635
|
+
offsets?: Array<number>;
|
|
636
|
+
};
|
|
637
|
+
type NoiseConfig = {
|
|
638
|
+
isActive: boolean;
|
|
639
|
+
useRandomOffset: boolean;
|
|
640
|
+
strength: number;
|
|
641
|
+
frequency: number;
|
|
642
|
+
octaves: number;
|
|
643
|
+
positionAmount: number;
|
|
644
|
+
rotationAmount: number;
|
|
645
|
+
sizeAmount: number;
|
|
646
|
+
};
|
|
647
|
+
/**
|
|
648
|
+
* Defines the velocity of particles over their lifetime, allowing for linear and orbital velocity (in degrees) adjustments.
|
|
649
|
+
* Supports constant values, random ranges, or curves (Bézier or easing) for each axis.
|
|
650
|
+
*
|
|
651
|
+
* @default
|
|
652
|
+
* isActive: false
|
|
653
|
+
* linear: { x: 0.0, y: 0.0, z: 0.0 }
|
|
654
|
+
* orbital: { x: 0.0, y: 0.0, z: 0.0 }
|
|
655
|
+
*
|
|
656
|
+
* @example
|
|
657
|
+
* // Linear velocity with a constant value
|
|
658
|
+
* linear: { x: 1, y: 0, z: -0.5 };
|
|
659
|
+
*
|
|
660
|
+
* // Linear velocity with random ranges
|
|
661
|
+
* linear: {
|
|
662
|
+
* x: { min: -1, max: 1 },
|
|
663
|
+
* y: { min: 0, max: 2 }
|
|
664
|
+
* };
|
|
665
|
+
*
|
|
666
|
+
* // Linear velocity using a Bézier curve
|
|
667
|
+
* linear: {
|
|
668
|
+
* z: {
|
|
669
|
+
* type: 'bezier',
|
|
670
|
+
* bezierPoints: [
|
|
671
|
+
* { x: 0, y: 0, percentage: 0 },
|
|
672
|
+
* { x: 0.5, y: 2 },
|
|
673
|
+
* { x: 1, y: 10, percentage: 1 }
|
|
674
|
+
* ],
|
|
675
|
+
* scale: 2
|
|
676
|
+
* }
|
|
677
|
+
* };
|
|
678
|
+
*
|
|
679
|
+
* // Orbital velocity with a constant value
|
|
680
|
+
* orbital: { x: 3, y: 5, z: 0 };
|
|
681
|
+
*
|
|
682
|
+
* // Orbital velocity using an easing curve
|
|
683
|
+
* orbital: {
|
|
684
|
+
* x: {
|
|
685
|
+
* type: 'easing',
|
|
686
|
+
* curveFunction: (time) => Math.sin(time * Math.PI),
|
|
687
|
+
* scale: 1.5
|
|
688
|
+
* }
|
|
689
|
+
* };
|
|
690
|
+
*/
|
|
691
|
+
type VelocityOverLifetime = {
|
|
692
|
+
isActive: boolean;
|
|
693
|
+
linear: {
|
|
694
|
+
x?: Constant | RandomBetweenTwoConstants | LifetimeCurve;
|
|
695
|
+
y?: Constant | RandomBetweenTwoConstants | LifetimeCurve;
|
|
696
|
+
z?: Constant | RandomBetweenTwoConstants | LifetimeCurve;
|
|
697
|
+
};
|
|
698
|
+
orbital: {
|
|
699
|
+
x?: Constant | RandomBetweenTwoConstants | LifetimeCurve;
|
|
700
|
+
y?: Constant | RandomBetweenTwoConstants | LifetimeCurve;
|
|
701
|
+
z?: Constant | RandomBetweenTwoConstants | LifetimeCurve;
|
|
702
|
+
};
|
|
703
|
+
};
|
|
704
|
+
/**
|
|
705
|
+
* Configuration object for the particle system.
|
|
706
|
+
* Defines all aspects of the particle system, including its appearance, behavior, and runtime events.
|
|
707
|
+
*/
|
|
708
|
+
type ParticleSystemConfig = {
|
|
709
|
+
/**
|
|
710
|
+
* Defines the position, rotation, and scale of the particle system.
|
|
711
|
+
*
|
|
712
|
+
* @see Transform
|
|
713
|
+
* @default
|
|
714
|
+
* transform: {
|
|
715
|
+
* position: new THREE.Vector3(),
|
|
716
|
+
* rotation: new THREE.Vector3(),
|
|
717
|
+
* scale: new THREE.Vector3(1, 1, 1),
|
|
718
|
+
* }
|
|
719
|
+
*/
|
|
720
|
+
transform?: Transform;
|
|
721
|
+
/**
|
|
722
|
+
* Duration of the particle system in seconds.
|
|
723
|
+
* Must be a positive value.
|
|
724
|
+
* @default 5.0
|
|
725
|
+
* @example
|
|
726
|
+
* const duration: number = 5; // System runs for 5 seconds.
|
|
727
|
+
*/
|
|
728
|
+
duration?: number;
|
|
729
|
+
/**
|
|
730
|
+
* Indicates whether the system should loop after finishing.
|
|
731
|
+
* @default true
|
|
732
|
+
* @example
|
|
733
|
+
* looping: true; // System loops continuously.
|
|
734
|
+
*/
|
|
735
|
+
looping?: boolean;
|
|
736
|
+
/**
|
|
737
|
+
* Delay before the particle system starts emitting particles.
|
|
738
|
+
* Supports a fixed value (`Constant`) or a random range (`RandomBetweenTwoConstants`).
|
|
739
|
+
* @default 0.0
|
|
740
|
+
* @example
|
|
741
|
+
* startDelay: 2; // Fixed 2-second delay.
|
|
742
|
+
* startDelay: { min: 0.5, max: 2 }; // Random delay between 0.5 and 2 seconds.
|
|
743
|
+
*/
|
|
744
|
+
startDelay?: Constant | RandomBetweenTwoConstants;
|
|
745
|
+
/**
|
|
746
|
+
* Initial lifetime of the particles.
|
|
747
|
+
* Supports constant value, random range, or curves (Bézier or easing).
|
|
748
|
+
* @default 5.0
|
|
749
|
+
* @example
|
|
750
|
+
* // Constant 3 seconds.
|
|
751
|
+
* startLifetime: 3;
|
|
752
|
+
*
|
|
753
|
+
* // Random range between 1 and 4 seconds.
|
|
754
|
+
* startLifetime: { min: 1, max: 4 };
|
|
755
|
+
*
|
|
756
|
+
* // Bézier curve example with scaling.
|
|
757
|
+
* startLifetime: {
|
|
758
|
+
* type: LifeTimeCurve.BEZIER,
|
|
759
|
+
* bezierPoints: [
|
|
760
|
+
* { x: 0, y: 0.275, percentage: 0 },
|
|
761
|
+
* { x: 0.5, y: 0.5 },
|
|
762
|
+
* { x: 1, y: 1, percentage: 1 }
|
|
763
|
+
* ],
|
|
764
|
+
* scale: 2
|
|
765
|
+
* };
|
|
766
|
+
*
|
|
767
|
+
* // Easing curve example with scaling.
|
|
768
|
+
* startLifetime: {
|
|
769
|
+
* type: LifeTimeCurve.EASING,
|
|
770
|
+
* curveFunction: (time) => Math.sin(time * Math.PI),
|
|
771
|
+
* scale: 0.5
|
|
772
|
+
* };
|
|
773
|
+
*/
|
|
774
|
+
startLifetime?: Constant | RandomBetweenTwoConstants | LifetimeCurve;
|
|
775
|
+
/**
|
|
776
|
+
* Defines the initial speed of the particles.
|
|
777
|
+
* Supports constant values, random ranges, or curves (Bézier or easing).
|
|
778
|
+
* @default 1.0
|
|
779
|
+
* @example
|
|
780
|
+
* // Constant value
|
|
781
|
+
* startSpeed: 3;
|
|
782
|
+
*
|
|
783
|
+
* // Random range
|
|
784
|
+
* startSpeed: { min: 1, max: 4 };
|
|
785
|
+
*
|
|
786
|
+
* // Bézier curve example with scaling.
|
|
787
|
+
* startSpeed: {
|
|
788
|
+
* type: 'bezier',
|
|
789
|
+
* bezierPoints: [
|
|
790
|
+
* { x: 0, y: 0.275, percentage: 0 },
|
|
791
|
+
* { x: 0.5, y: 0.5 },
|
|
792
|
+
* { x: 1, y: 1, percentage: 1 }
|
|
793
|
+
* ],
|
|
794
|
+
* scale: 2
|
|
795
|
+
* };
|
|
796
|
+
*
|
|
797
|
+
* // Easing curve example with scaling.
|
|
798
|
+
* startSpeed: {
|
|
799
|
+
* type: 'easing',
|
|
800
|
+
* curveFunction: (time) => Math.sin(time * Math.PI),
|
|
801
|
+
* scale: 1.5
|
|
802
|
+
* };
|
|
803
|
+
*/
|
|
804
|
+
startSpeed?: Constant | RandomBetweenTwoConstants | LifetimeCurve;
|
|
805
|
+
/**
|
|
806
|
+
* Defines the initial size of the particles.
|
|
807
|
+
* Supports constant values, random ranges, or curves (Bézier or easing).
|
|
808
|
+
* @default 1.0
|
|
809
|
+
* @example
|
|
810
|
+
* // Constant value
|
|
811
|
+
* startSize: 3;
|
|
812
|
+
*
|
|
813
|
+
* // Random range
|
|
814
|
+
* startSize: { min: 1, max: 4 };
|
|
815
|
+
*
|
|
816
|
+
* // Bézier curve example with scaling.
|
|
817
|
+
* startSize: {
|
|
818
|
+
* type: 'bezier',
|
|
819
|
+
* bezierPoints: [
|
|
820
|
+
* { x: 0, y: 0.275, percentage: 0 },
|
|
821
|
+
* { x: 0.5, y: 0.5 },
|
|
822
|
+
* { x: 1, y: 1, percentage: 1 }
|
|
823
|
+
* ],
|
|
824
|
+
* scale: 2
|
|
825
|
+
* };
|
|
826
|
+
*
|
|
827
|
+
* // Easing curve example with scaling.
|
|
828
|
+
* startSize: {
|
|
829
|
+
* type: 'easing',
|
|
830
|
+
* curveFunction: (time) => Math.sin(time * Math.PI),
|
|
831
|
+
* scale: 1.5
|
|
832
|
+
* };
|
|
833
|
+
*/
|
|
834
|
+
startSize?: Constant | RandomBetweenTwoConstants | LifetimeCurve;
|
|
835
|
+
/**
|
|
836
|
+
* Defines the initial opacity of the particles.
|
|
837
|
+
* Supports constant values, random ranges, or curves (Bézier or easing).
|
|
838
|
+
* @default 1.0
|
|
839
|
+
* @example
|
|
840
|
+
* // Constant value
|
|
841
|
+
* startOpacity: 3;
|
|
842
|
+
*
|
|
843
|
+
* // Random range
|
|
844
|
+
* startOpacity: { min: 1, max: 4 };
|
|
845
|
+
*
|
|
846
|
+
* // Bézier curve example with scaling.
|
|
847
|
+
* startOpacity: {
|
|
848
|
+
* type: 'bezier',
|
|
849
|
+
* bezierPoints: [
|
|
850
|
+
* { x: 0, y: 0.275, percentage: 0 },
|
|
851
|
+
* { x: 0.5, y: 0.5 },
|
|
852
|
+
* { x: 1, y: 1, percentage: 1 }
|
|
853
|
+
* ],
|
|
854
|
+
* scale: 2
|
|
855
|
+
* };
|
|
856
|
+
*
|
|
857
|
+
* // Easing curve example with scaling.
|
|
858
|
+
* startOpacity: {
|
|
859
|
+
* type: 'easing',
|
|
860
|
+
* curveFunction: (time) => Math.sin(time * Math.PI),
|
|
861
|
+
* scale: 1.5
|
|
862
|
+
* };
|
|
863
|
+
*/
|
|
864
|
+
startOpacity?: Constant | RandomBetweenTwoConstants | LifetimeCurve;
|
|
865
|
+
/**
|
|
866
|
+
* Defines the initial rotation of the particles in degrees.
|
|
867
|
+
* Supports constant values, random ranges, or curves (Bézier or easing).
|
|
868
|
+
* @default 0.0
|
|
869
|
+
* @example
|
|
870
|
+
* // Constant value
|
|
871
|
+
* startRotation: 3;
|
|
872
|
+
*
|
|
873
|
+
* // Random range
|
|
874
|
+
* startRotation: { min: 1, max: 4 };
|
|
875
|
+
*
|
|
876
|
+
* // Bézier curve example with scaling.
|
|
877
|
+
* startRotation: {
|
|
878
|
+
* type: 'bezier',
|
|
879
|
+
* bezierPoints: [
|
|
880
|
+
* { x: 0, y: 0.275, percentage: 0 },
|
|
881
|
+
* { x: 0.5, y: 0.5 },
|
|
882
|
+
* { x: 1, y: 1, percentage: 1 }
|
|
883
|
+
* ],
|
|
884
|
+
* scale: 2
|
|
885
|
+
* };
|
|
886
|
+
*
|
|
887
|
+
* // Easing curve example with scaling.
|
|
888
|
+
* startRotation: {
|
|
889
|
+
* type: 'easing',
|
|
890
|
+
* curveFunction: (time) => Math.sin(time * Math.PI),
|
|
891
|
+
* scale: 1.5
|
|
892
|
+
* };
|
|
893
|
+
*/
|
|
894
|
+
startRotation?: Constant | RandomBetweenTwoConstants | LifetimeCurve;
|
|
895
|
+
/**
|
|
896
|
+
* Initial color of the particles.
|
|
897
|
+
* Supports a min-max range for color interpolation.
|
|
898
|
+
*
|
|
899
|
+
* @default
|
|
900
|
+
* startColor: {
|
|
901
|
+
* min: { r: 1.0, g: 1.0, b: 1.0 },
|
|
902
|
+
* max: { r: 1.0, g: 1.0, b: 1.0 },
|
|
903
|
+
* }
|
|
904
|
+
*/
|
|
905
|
+
startColor?: MinMaxColor;
|
|
906
|
+
/**
|
|
907
|
+
* Defines the gravity strength applied to particles.
|
|
908
|
+
* This value affects the downward acceleration of particles over time.
|
|
909
|
+
*
|
|
910
|
+
* @default 0.0
|
|
911
|
+
*
|
|
912
|
+
* @example
|
|
913
|
+
* // No gravity
|
|
914
|
+
* gravity: 0;
|
|
915
|
+
*
|
|
916
|
+
* // Moderate gravity
|
|
917
|
+
* gravity: 9.8; // Similar to Earth's gravity
|
|
918
|
+
*
|
|
919
|
+
* // Strong gravity
|
|
920
|
+
* gravity: 20.0;
|
|
921
|
+
*/
|
|
922
|
+
gravity?: Constant;
|
|
923
|
+
/**
|
|
924
|
+
* Defines the simulation space in which particles are simulated.
|
|
925
|
+
* Determines whether the particles move relative to the local object space or the world space.
|
|
926
|
+
*
|
|
927
|
+
* @default SimulationSpace.LOCAL
|
|
928
|
+
*
|
|
929
|
+
* @example
|
|
930
|
+
* // Simulate particles in local space (default)
|
|
931
|
+
* simulationSpace: SimulationSpace.LOCAL;
|
|
932
|
+
*
|
|
933
|
+
* // Simulate particles in world space
|
|
934
|
+
* simulationSpace: SimulationSpace.WORLD;
|
|
935
|
+
*/
|
|
936
|
+
simulationSpace?: SimulationSpace;
|
|
937
|
+
/**
|
|
938
|
+
* Defines the maximum number of particles allowed in the system.
|
|
939
|
+
* This value limits the total number of active particles at any given time.
|
|
940
|
+
*
|
|
941
|
+
* @default 100.0
|
|
942
|
+
*
|
|
943
|
+
* @example
|
|
944
|
+
* // Default value
|
|
945
|
+
* maxParticles: 100.0;
|
|
946
|
+
*
|
|
947
|
+
* // Increase the maximum number of particles
|
|
948
|
+
* maxParticles: 500.0;
|
|
949
|
+
*
|
|
950
|
+
* // Limit to a small number of particles
|
|
951
|
+
* maxParticles: 10.0;
|
|
952
|
+
*/
|
|
953
|
+
maxParticles?: Constant;
|
|
954
|
+
/**
|
|
955
|
+
* Defines the particle emission settings.
|
|
956
|
+
* Configures the emission rate over time and distance.
|
|
957
|
+
*
|
|
958
|
+
* @see Emission
|
|
959
|
+
* @default
|
|
960
|
+
* emission: {
|
|
961
|
+
* rateOverTime: 10.0,
|
|
962
|
+
* rateOverDistance: 0.0,
|
|
963
|
+
* }
|
|
964
|
+
*/
|
|
965
|
+
emission?: Emission;
|
|
966
|
+
/**
|
|
967
|
+
* Configuration for the emitter shape.
|
|
968
|
+
* Determines the shape and parameters for particle emission.
|
|
969
|
+
*
|
|
970
|
+
* @see ShapeConfig
|
|
971
|
+
*/
|
|
972
|
+
shape?: ShapeConfig;
|
|
973
|
+
/**
|
|
974
|
+
* Defines the texture used for rendering particles.
|
|
975
|
+
* This texture is applied to all particles in the system, and can be used to control their appearance.
|
|
976
|
+
*
|
|
977
|
+
* @default undefined
|
|
978
|
+
*
|
|
979
|
+
* @example
|
|
980
|
+
* // Using a predefined texture
|
|
981
|
+
* map: new THREE.TextureLoader().load('path/to/texture.png');
|
|
982
|
+
*
|
|
983
|
+
* // No texture (default behavior)
|
|
984
|
+
* map: undefined;
|
|
985
|
+
*/
|
|
986
|
+
map?: THREE.Texture;
|
|
987
|
+
/**
|
|
988
|
+
* Renderer configuration for blending, transparency, and depth testing.
|
|
989
|
+
*
|
|
990
|
+
* @see Renderer
|
|
991
|
+
* @default
|
|
992
|
+
* renderer: {
|
|
993
|
+
* blending: THREE.NormalBlending,
|
|
994
|
+
* discardBackgroundColor: false,
|
|
995
|
+
* backgroundColorTolerance: 1.0,
|
|
996
|
+
* backgroundColor: { r: 1.0, g: 1.0, b: 1.0 },
|
|
997
|
+
* transparent: true,
|
|
998
|
+
* depthTest: true,
|
|
999
|
+
* depthWrite: false
|
|
1000
|
+
* }
|
|
1001
|
+
*/
|
|
1002
|
+
renderer?: Renderer;
|
|
1003
|
+
/**
|
|
1004
|
+
* Defines the velocity settings of particles over their lifetime.
|
|
1005
|
+
* Configures both linear and orbital velocity changes.
|
|
1006
|
+
*
|
|
1007
|
+
* @see VelocityOverLifetime
|
|
1008
|
+
* @default
|
|
1009
|
+
* velocityOverLifetime: {
|
|
1010
|
+
* isActive: false,
|
|
1011
|
+
* linear: {
|
|
1012
|
+
* x: 0,
|
|
1013
|
+
* y: 0,
|
|
1014
|
+
* z: 0,
|
|
1015
|
+
* },
|
|
1016
|
+
* orbital: {
|
|
1017
|
+
* x: 0,
|
|
1018
|
+
* y: 0,
|
|
1019
|
+
* z: 0,
|
|
1020
|
+
* },
|
|
1021
|
+
* }
|
|
1022
|
+
*/
|
|
1023
|
+
velocityOverLifetime?: VelocityOverLifetime;
|
|
1024
|
+
/**
|
|
1025
|
+
* Controls the size of particles over their lifetime.
|
|
1026
|
+
* The size can be adjusted using a lifetime curve (Bézier or other supported types).
|
|
1027
|
+
*
|
|
1028
|
+
* @default
|
|
1029
|
+
* sizeOverLifetime: {
|
|
1030
|
+
* isActive: false,
|
|
1031
|
+
* lifetimeCurve: {
|
|
1032
|
+
* type: LifeTimeCurve.BEZIER,
|
|
1033
|
+
* scale: 1,
|
|
1034
|
+
* bezierPoints: [
|
|
1035
|
+
* { x: 0, y: 0, percentage: 0 },
|
|
1036
|
+
* { x: 1, y: 1, percentage: 1 },
|
|
1037
|
+
* ],
|
|
1038
|
+
* },
|
|
1039
|
+
* }
|
|
1040
|
+
*/
|
|
1041
|
+
sizeOverLifetime?: {
|
|
1042
|
+
isActive: boolean;
|
|
1043
|
+
lifetimeCurve: LifetimeCurve;
|
|
1044
|
+
};
|
|
1045
|
+
/**
|
|
1046
|
+
* Controls the opacity of particles over their lifetime.
|
|
1047
|
+
* The opacity can be adjusted using a lifetime curve (Bézier or other supported types).
|
|
1048
|
+
*
|
|
1049
|
+
* @default
|
|
1050
|
+
* opacityOverLifetime: {
|
|
1051
|
+
* isActive: false,
|
|
1052
|
+
* lifetimeCurve: {
|
|
1053
|
+
* type: LifeTimeCurve.BEZIER,
|
|
1054
|
+
* scale: 1,
|
|
1055
|
+
* bezierPoints: [
|
|
1056
|
+
* { x: 0, y: 0, percentage: 0 },
|
|
1057
|
+
* { x: 1, y: 1, percentage: 1 },
|
|
1058
|
+
* ],
|
|
1059
|
+
* },
|
|
1060
|
+
* }
|
|
1061
|
+
*/
|
|
1062
|
+
opacityOverLifetime?: {
|
|
1063
|
+
isActive: boolean;
|
|
1064
|
+
lifetimeCurve: LifetimeCurve;
|
|
1065
|
+
};
|
|
1066
|
+
/**
|
|
1067
|
+
* Controls the color of particles over their lifetime.
|
|
1068
|
+
* Each RGB channel can be adjusted independently using a lifetime curve (Bézier or easing).
|
|
1069
|
+
* The curves act as multipliers (0-1 range) that are applied to the particle's start color.
|
|
1070
|
+
*
|
|
1071
|
+
* This follows Unity's Color over Lifetime behavior where the final color is:
|
|
1072
|
+
* finalColor = startColor * colorOverLifetime
|
|
1073
|
+
*
|
|
1074
|
+
* **IMPORTANT**: To achieve full color transitions, set startColor to white { r: 1, g: 1, b: 1 }.
|
|
1075
|
+
* If startColor has any channel set to 0, that channel cannot be modified by colorOverLifetime.
|
|
1076
|
+
*
|
|
1077
|
+
* @example
|
|
1078
|
+
* // Rainbow effect - requires white startColor
|
|
1079
|
+
* startColor: { min: { r: 1, g: 1, b: 1 }, max: { r: 1, g: 1, b: 1 } }
|
|
1080
|
+
* colorOverLifetime: {
|
|
1081
|
+
* isActive: true,
|
|
1082
|
+
* r: { // Red: full -> half -> off
|
|
1083
|
+
* type: LifeTimeCurve.BEZIER,
|
|
1084
|
+
* scale: 1,
|
|
1085
|
+
* bezierPoints: [
|
|
1086
|
+
* { x: 0, y: 1, percentage: 0 },
|
|
1087
|
+
* { x: 0.5, y: 0.5, percentage: 0.5 },
|
|
1088
|
+
* { x: 1, y: 0, percentage: 1 },
|
|
1089
|
+
* ],
|
|
1090
|
+
* },
|
|
1091
|
+
* g: { // Green: off -> full -> off
|
|
1092
|
+
* type: LifeTimeCurve.BEZIER,
|
|
1093
|
+
* scale: 1,
|
|
1094
|
+
* bezierPoints: [
|
|
1095
|
+
* { x: 0, y: 0, percentage: 0 },
|
|
1096
|
+
* { x: 0.5, y: 1, percentage: 0.5 },
|
|
1097
|
+
* { x: 1, y: 0, percentage: 1 },
|
|
1098
|
+
* ],
|
|
1099
|
+
* },
|
|
1100
|
+
* b: { // Blue: off -> half -> full
|
|
1101
|
+
* type: LifeTimeCurve.BEZIER,
|
|
1102
|
+
* scale: 1,
|
|
1103
|
+
* bezierPoints: [
|
|
1104
|
+
* { x: 0, y: 0, percentage: 0 },
|
|
1105
|
+
* { x: 0.5, y: 0.5, percentage: 0.5 },
|
|
1106
|
+
* { x: 1, y: 1, percentage: 1 },
|
|
1107
|
+
* ],
|
|
1108
|
+
* },
|
|
1109
|
+
* }
|
|
1110
|
+
*
|
|
1111
|
+
* @default
|
|
1112
|
+
* colorOverLifetime: {
|
|
1113
|
+
* isActive: false,
|
|
1114
|
+
* r: {
|
|
1115
|
+
* type: LifeTimeCurve.BEZIER,
|
|
1116
|
+
* scale: 1,
|
|
1117
|
+
* bezierPoints: [
|
|
1118
|
+
* { x: 0, y: 1, percentage: 0 },
|
|
1119
|
+
* { x: 1, y: 1, percentage: 1 },
|
|
1120
|
+
* ],
|
|
1121
|
+
* },
|
|
1122
|
+
* g: {
|
|
1123
|
+
* type: LifeTimeCurve.BEZIER,
|
|
1124
|
+
* scale: 1,
|
|
1125
|
+
* bezierPoints: [
|
|
1126
|
+
* { x: 0, y: 1, percentage: 0 },
|
|
1127
|
+
* { x: 1, y: 1, percentage: 1 },
|
|
1128
|
+
* ],
|
|
1129
|
+
* },
|
|
1130
|
+
* b: {
|
|
1131
|
+
* type: LifeTimeCurve.BEZIER,
|
|
1132
|
+
* scale: 1,
|
|
1133
|
+
* bezierPoints: [
|
|
1134
|
+
* { x: 0, y: 1, percentage: 0 },
|
|
1135
|
+
* { x: 1, y: 1, percentage: 1 },
|
|
1136
|
+
* ],
|
|
1137
|
+
* },
|
|
1138
|
+
* }
|
|
1139
|
+
*/
|
|
1140
|
+
colorOverLifetime?: {
|
|
1141
|
+
isActive: boolean;
|
|
1142
|
+
r: LifetimeCurve;
|
|
1143
|
+
g: LifetimeCurve;
|
|
1144
|
+
b: LifetimeCurve;
|
|
1145
|
+
};
|
|
1146
|
+
/**
|
|
1147
|
+
* Controls the rotation of particles over their lifetime.
|
|
1148
|
+
* The rotation can be randomized between two constants, and the feature can be toggled on or off.
|
|
1149
|
+
*
|
|
1150
|
+
* @default
|
|
1151
|
+
* rotationOverLifetime: {
|
|
1152
|
+
* isActive: false,
|
|
1153
|
+
* min: 0.0,
|
|
1154
|
+
* max: 0.0,
|
|
1155
|
+
* }
|
|
1156
|
+
*/
|
|
1157
|
+
rotationOverLifetime?: {
|
|
1158
|
+
isActive: boolean;
|
|
1159
|
+
} & RandomBetweenTwoConstants;
|
|
1160
|
+
/**
|
|
1161
|
+
* Noise configuration affecting position, rotation, and size.
|
|
1162
|
+
*
|
|
1163
|
+
* @see NoiseConfig
|
|
1164
|
+
* @default
|
|
1165
|
+
* noise: {
|
|
1166
|
+
* isActive: false,
|
|
1167
|
+
* useRandomOffset: false,
|
|
1168
|
+
* strength: 1.0,
|
|
1169
|
+
* frequency: 0.5,
|
|
1170
|
+
* octaves: 1,
|
|
1171
|
+
* positionAmount: 1.0,
|
|
1172
|
+
* rotationAmount: 0.0,
|
|
1173
|
+
* sizeAmount: 0.0,
|
|
1174
|
+
* }
|
|
1175
|
+
*/
|
|
1176
|
+
noise?: NoiseConfig;
|
|
1177
|
+
/**
|
|
1178
|
+
* Configures the texture sheet animation settings for particles.
|
|
1179
|
+
* Controls how textures are animated over the lifetime of particles.
|
|
1180
|
+
*
|
|
1181
|
+
* @see TextureSheetAnimation
|
|
1182
|
+
* @default
|
|
1183
|
+
* textureSheetAnimation: {
|
|
1184
|
+
* tiles: new THREE.Vector2(1.0, 1.0),
|
|
1185
|
+
* timeMode: TimeMode.LIFETIME,
|
|
1186
|
+
* fps: 30.0,
|
|
1187
|
+
* startFrame: 0,
|
|
1188
|
+
* }
|
|
1189
|
+
*/
|
|
1190
|
+
textureSheetAnimation?: TextureSheetAnimation;
|
|
1191
|
+
/**
|
|
1192
|
+
* Called on every update frame with particle system data.
|
|
1193
|
+
*/
|
|
1194
|
+
onUpdate?: (data: {
|
|
1195
|
+
particleSystem: THREE.Points;
|
|
1196
|
+
delta: number;
|
|
1197
|
+
elapsed: number;
|
|
1198
|
+
lifetime: number;
|
|
1199
|
+
iterationCount: number;
|
|
1200
|
+
}) => void;
|
|
1201
|
+
/**
|
|
1202
|
+
* Called when the system completes an iteration.
|
|
1203
|
+
*/
|
|
1204
|
+
onComplete?: () => void;
|
|
1205
|
+
};
|
|
1206
|
+
type NormalizedParticleSystemConfig = Required<ParticleSystemConfig>;
|
|
1207
|
+
/**
|
|
1208
|
+
* Tracks the state of a burst emission event.
|
|
1209
|
+
* Used internally to determine when bursts should fire and how many cycles remain.
|
|
1210
|
+
*/
|
|
1211
|
+
type BurstState = {
|
|
1212
|
+
/** Number of cycles that have been executed so far */
|
|
1213
|
+
cyclesExecuted: number;
|
|
1214
|
+
/** Time (in ms) when the last cycle was executed */
|
|
1215
|
+
lastCycleTime: number;
|
|
1216
|
+
/** Whether the probability check passed for this iteration */
|
|
1217
|
+
probabilityPassed: boolean;
|
|
1218
|
+
};
|
|
1219
|
+
type GeneralData = {
|
|
1220
|
+
particleSystemId: number;
|
|
1221
|
+
normalizedLifetimePercentage: number;
|
|
1222
|
+
creationTimes: Array<number>;
|
|
1223
|
+
distanceFromLastEmitByDistance: number;
|
|
1224
|
+
lastWorldPosition: THREE.Vector3;
|
|
1225
|
+
currentWorldPosition: THREE.Vector3;
|
|
1226
|
+
worldPositionChange: THREE.Vector3;
|
|
1227
|
+
wrapperQuaternion: THREE.Quaternion;
|
|
1228
|
+
lastWorldQuaternion: THREE.Quaternion;
|
|
1229
|
+
worldQuaternion: THREE.Quaternion;
|
|
1230
|
+
worldEuler: THREE.Euler;
|
|
1231
|
+
gravityVelocity: THREE.Vector3;
|
|
1232
|
+
startValues: Record<string, Array<number>>;
|
|
1233
|
+
linearVelocityData?: Array<{
|
|
1234
|
+
speed: THREE.Vector3;
|
|
1235
|
+
valueModifiers: {
|
|
1236
|
+
x?: CurveFunction;
|
|
1237
|
+
y?: CurveFunction;
|
|
1238
|
+
z?: CurveFunction;
|
|
1239
|
+
};
|
|
1240
|
+
}>;
|
|
1241
|
+
orbitalVelocityData?: Array<{
|
|
1242
|
+
speed: THREE.Vector3;
|
|
1243
|
+
positionOffset: THREE.Vector3;
|
|
1244
|
+
valueModifiers: {
|
|
1245
|
+
x?: CurveFunction;
|
|
1246
|
+
y?: CurveFunction;
|
|
1247
|
+
z?: CurveFunction;
|
|
1248
|
+
};
|
|
1249
|
+
}>;
|
|
1250
|
+
lifetimeValues: Record<string, Array<number>>;
|
|
1251
|
+
noise: Noise;
|
|
1252
|
+
isEnabled: boolean;
|
|
1253
|
+
/** Tracks the state of each burst emission event */
|
|
1254
|
+
burstStates?: Array<BurstState>;
|
|
1255
|
+
};
|
|
1256
|
+
type ParticleSystemInstance = {
|
|
1257
|
+
particleSystem: THREE.Points;
|
|
1258
|
+
wrapper?: Gyroscope;
|
|
1259
|
+
elapsedUniform: {
|
|
1260
|
+
value: number;
|
|
1261
|
+
};
|
|
1262
|
+
generalData: GeneralData;
|
|
1263
|
+
onUpdate: (data: {
|
|
1264
|
+
particleSystem: THREE.Points;
|
|
1265
|
+
delta: number;
|
|
1266
|
+
elapsed: number;
|
|
1267
|
+
lifetime: number;
|
|
1268
|
+
normalizedLifetime: number;
|
|
1269
|
+
iterationCount: number;
|
|
1270
|
+
}) => void;
|
|
1271
|
+
onComplete: (data: {
|
|
1272
|
+
particleSystem: THREE.Points;
|
|
1273
|
+
}) => void;
|
|
1274
|
+
creationTime: number;
|
|
1275
|
+
lastEmissionTime: number;
|
|
1276
|
+
duration: number;
|
|
1277
|
+
looping: boolean;
|
|
1278
|
+
simulationSpace: SimulationSpace;
|
|
1279
|
+
gravity: number;
|
|
1280
|
+
emission: Emission;
|
|
1281
|
+
normalizedConfig: NormalizedParticleSystemConfig;
|
|
1282
|
+
iterationCount: number;
|
|
1283
|
+
velocities: Array<THREE.Vector3>;
|
|
1284
|
+
freeList: Array<number>;
|
|
1285
|
+
deactivateParticle: (particleIndex: number) => void;
|
|
1286
|
+
activateParticle: (data: {
|
|
1287
|
+
particleIndex: number;
|
|
1288
|
+
activationTime: number;
|
|
1289
|
+
position: Required<Point3D>;
|
|
1290
|
+
}) => void;
|
|
1291
|
+
};
|
|
1292
|
+
/**
|
|
1293
|
+
* Represents a particle system instance, providing methods to control and manage its lifecycle.
|
|
1294
|
+
*
|
|
1295
|
+
* @property instance - The underlying Three.js `Points` object or a `Gyroscope` used for particle rendering.
|
|
1296
|
+
* @property resumeEmitter - Resumes the particle emitter, allowing particles to be emitted again.
|
|
1297
|
+
* @property pauseEmitter - Pauses the particle emitter, stopping any new particles from being emitted.
|
|
1298
|
+
* @property dispose - Disposes of the particle system, cleaning up resources to free memory.
|
|
1299
|
+
*
|
|
1300
|
+
* @example
|
|
1301
|
+
* const particleSystem: ParticleSystem = {
|
|
1302
|
+
* instance: new THREE.Points(geometry, material),
|
|
1303
|
+
* resumeEmitter: () => { /* resume logic * / },
|
|
1304
|
+
* pauseEmitter: () => { /* pause logic * / },
|
|
1305
|
+
* dispose: () => { /* cleanup logic * / },
|
|
1306
|
+
* };
|
|
1307
|
+
*
|
|
1308
|
+
* particleSystem.pauseEmitter(); // Stop particle emission
|
|
1309
|
+
* particleSystem.resumeEmitter(); // Resume particle emission
|
|
1310
|
+
* particleSystem.dispose(); // Cleanup the particle system
|
|
1311
|
+
*/
|
|
1312
|
+
type ParticleSystem = {
|
|
1313
|
+
instance: THREE.Points | Gyroscope;
|
|
1314
|
+
resumeEmitter: () => void;
|
|
1315
|
+
pauseEmitter: () => void;
|
|
1316
|
+
dispose: () => void;
|
|
1317
|
+
update: (cycleData: CycleData) => void;
|
|
1318
|
+
};
|
|
1319
|
+
/**
|
|
1320
|
+
* Data representing the current cycle of the particle system's update loop.
|
|
1321
|
+
*
|
|
1322
|
+
* @property now - The current timestamp in milliseconds.
|
|
1323
|
+
* @property delta - The time elapsed since the last update, in seconds.
|
|
1324
|
+
* @property elapsed - The total time elapsed since the particle system started, in seconds.
|
|
1325
|
+
*
|
|
1326
|
+
* @example
|
|
1327
|
+
* const cycleData: CycleData = {
|
|
1328
|
+
* now: performance.now(),
|
|
1329
|
+
* delta: 0.016, // 16ms frame time
|
|
1330
|
+
* elapsed: 1.25, // 1.25 seconds since start
|
|
1331
|
+
* };
|
|
1332
|
+
*/
|
|
1333
|
+
type CycleData = {
|
|
1334
|
+
now: number;
|
|
1335
|
+
delta: number;
|
|
1336
|
+
elapsed: number;
|
|
1337
|
+
};
|
|
1338
|
+
|
|
1339
|
+
declare const createBezierCurveFunction: (particleSystemId: number, bezierPoints: Array<BezierPoint>) => CurveFunction;
|
|
1340
|
+
declare const removeBezierCurveFunction: (particleSystemId: number) => void;
|
|
1341
|
+
declare const getBezierCacheSize: () => number;
|
|
1342
|
+
|
|
1343
|
+
/**
|
|
1344
|
+
* Predefined easing function identifiers for animating particle properties
|
|
1345
|
+
* over their lifetime.
|
|
1346
|
+
*
|
|
1347
|
+
* These functions control the rate of change and create different animation
|
|
1348
|
+
* feels. Each type has three variants:
|
|
1349
|
+
* - **IN**: Starts slow, accelerates toward the end
|
|
1350
|
+
* - **OUT**: Starts fast, decelerates toward the end
|
|
1351
|
+
* - **IN_OUT**: Combines both, slow at start and end, fast in middle
|
|
1352
|
+
*
|
|
1353
|
+
* @enum {string}
|
|
1354
|
+
*
|
|
1355
|
+
* @see {@link https://easings.net/} - Visual reference for easing functions
|
|
1356
|
+
*/
|
|
1357
|
+
declare const enum CurveFunctionId {
|
|
1358
|
+
/** Use custom Bezier curve (not an easing function) */
|
|
1359
|
+
BEZIER = "BEZIER",
|
|
1360
|
+
/** Linear interpolation with constant rate of change */
|
|
1361
|
+
LINEAR = "LINEAR",
|
|
1362
|
+
/** Quadratic (t²) easing - gentle acceleration */
|
|
1363
|
+
QUADRATIC_IN = "QUADRATIC_IN",
|
|
1364
|
+
/** Quadratic (t²) easing - gentle deceleration */
|
|
1365
|
+
QUADRATIC_OUT = "QUADRATIC_OUT",
|
|
1366
|
+
/** Quadratic (t²) easing - gentle acceleration then deceleration */
|
|
1367
|
+
QUADRATIC_IN_OUT = "QUADRATIC_IN_OUT",
|
|
1368
|
+
/** Cubic (t³) easing - moderate acceleration */
|
|
1369
|
+
CUBIC_IN = "CUBIC_IN",
|
|
1370
|
+
/** Cubic (t³) easing - moderate deceleration */
|
|
1371
|
+
CUBIC_OUT = "CUBIC_OUT",
|
|
1372
|
+
/** Cubic (t³) easing - moderate acceleration then deceleration */
|
|
1373
|
+
CUBIC_IN_OUT = "CUBIC_IN_OUT",
|
|
1374
|
+
/** Quartic (t⁴) easing - strong acceleration */
|
|
1375
|
+
QUARTIC_IN = "QUARTIC_IN",
|
|
1376
|
+
/** Quartic (t⁴) easing - strong deceleration */
|
|
1377
|
+
QUARTIC_OUT = "QUARTIC_OUT",
|
|
1378
|
+
/** Quartic (t⁴) easing - strong acceleration then deceleration */
|
|
1379
|
+
QUARTIC_IN_OUT = "QUARTIC_IN_OUT",
|
|
1380
|
+
/** Quintic (t⁵) easing - very strong acceleration */
|
|
1381
|
+
QUINTIC_IN = "QUINTIC_IN",
|
|
1382
|
+
/** Quintic (t⁵) easing - very strong deceleration */
|
|
1383
|
+
QUINTIC_OUT = "QUINTIC_OUT",
|
|
1384
|
+
/** Quintic (t⁵) easing - very strong acceleration then deceleration */
|
|
1385
|
+
QUINTIC_IN_OUT = "QUINTIC_IN_OUT",
|
|
1386
|
+
/** Sinusoidal easing - smooth, natural acceleration */
|
|
1387
|
+
SINUSOIDAL_IN = "SINUSOIDAL_IN",
|
|
1388
|
+
/** Sinusoidal easing - smooth, natural deceleration */
|
|
1389
|
+
SINUSOIDAL_OUT = "SINUSOIDAL_OUT",
|
|
1390
|
+
/** Sinusoidal easing - smooth acceleration then deceleration */
|
|
1391
|
+
SINUSOIDAL_IN_OUT = "SINUSOIDAL_IN_OUT",
|
|
1392
|
+
/** Exponential easing - dramatic, explosive acceleration */
|
|
1393
|
+
EXPONENTIAL_IN = "EXPONENTIAL_IN",
|
|
1394
|
+
/** Exponential easing - dramatic, explosive deceleration */
|
|
1395
|
+
EXPONENTIAL_OUT = "EXPONENTIAL_OUT",
|
|
1396
|
+
/** Exponential easing - dramatic acceleration then deceleration */
|
|
1397
|
+
EXPONENTIAL_IN_OUT = "EXPONENTIAL_IN_OUT",
|
|
1398
|
+
/** Circular easing - sharp acceleration with curved trajectory */
|
|
1399
|
+
CIRCULAR_IN = "CIRCULAR_IN",
|
|
1400
|
+
/** Circular easing - sharp deceleration with curved trajectory */
|
|
1401
|
+
CIRCULAR_OUT = "CIRCULAR_OUT",
|
|
1402
|
+
/** Circular easing - sharp acceleration then deceleration */
|
|
1403
|
+
CIRCULAR_IN_OUT = "CIRCULAR_IN_OUT",
|
|
1404
|
+
/** Elastic easing - oscillates back before accelerating (spring-like) */
|
|
1405
|
+
ELASTIC_IN = "ELASTIC_IN",
|
|
1406
|
+
/** Elastic easing - overshoots then oscillates back (spring-like) */
|
|
1407
|
+
ELASTIC_OUT = "ELASTIC_OUT",
|
|
1408
|
+
/** Elastic easing - oscillates at both ends (spring-like) */
|
|
1409
|
+
ELASTIC_IN_OUT = "ELASTIC_IN_OUT",
|
|
1410
|
+
/** Back easing - pulls back before accelerating forward */
|
|
1411
|
+
BACK_IN = "BACK_IN",
|
|
1412
|
+
/** Back easing - overshoots forward then pulls back */
|
|
1413
|
+
BACK_OUT = "BACK_OUT",
|
|
1414
|
+
/** Back easing - pulls back, overshoots, then settles */
|
|
1415
|
+
BACK_IN_OUT = "BACK_IN_OUT",
|
|
1416
|
+
/** Bounce easing - bounces at the start */
|
|
1417
|
+
BOUNCE_IN = "BOUNCE_IN",
|
|
1418
|
+
/** Bounce easing - bounces at the end (like a ball landing) */
|
|
1419
|
+
BOUNCE_OUT = "BOUNCE_OUT",
|
|
1420
|
+
/** Bounce easing - bounces at both start and end */
|
|
1421
|
+
BOUNCE_IN_OUT = "BOUNCE_IN_OUT"
|
|
1422
|
+
}
|
|
1423
|
+
/**
|
|
1424
|
+
* Resolves a curve function from an identifier or returns the function itself.
|
|
1425
|
+
*
|
|
1426
|
+
* This utility function allows you to use either a {@link CurveFunctionId} string
|
|
1427
|
+
* identifier or a custom function directly.
|
|
1428
|
+
*
|
|
1429
|
+
* @param curveFunctionId - Either a {@link CurveFunctionId} enum value or a
|
|
1430
|
+
* custom {@link CurveFunction} implementation
|
|
1431
|
+
* @returns The actual easing function that takes a normalized time value (0-1)
|
|
1432
|
+
* and returns the eased value
|
|
1433
|
+
*
|
|
1434
|
+
* @example
|
|
1435
|
+
* ```typescript
|
|
1436
|
+
* import { getCurveFunction, CurveFunctionId } from '@newkrok/three-particles';
|
|
1437
|
+
*
|
|
1438
|
+
* // Using a predefined easing function
|
|
1439
|
+
* const easingFunc = getCurveFunction(CurveFunctionId.CUBIC_OUT);
|
|
1440
|
+
* console.log(easingFunc(0.5)); // Returns eased value at 50% progress
|
|
1441
|
+
*
|
|
1442
|
+
* // Using a custom function
|
|
1443
|
+
* const customEasing = (t: number) => t * t; // Quadratic
|
|
1444
|
+
* const customFunc = getCurveFunction(customEasing);
|
|
1445
|
+
* console.log(customFunc(0.5)); // Returns 0.25
|
|
1446
|
+
* ```
|
|
1447
|
+
*/
|
|
1448
|
+
declare const getCurveFunction: (curveFunctionId: CurveFunctionId | CurveFunction) => CurveFunction;
|
|
1449
|
+
|
|
1450
|
+
/**
|
|
1451
|
+
* Applies all active modifiers to a single particle during the update cycle.
|
|
1452
|
+
*
|
|
1453
|
+
* This function handles the animation and modification of particle properties over its lifetime,
|
|
1454
|
+
* including velocity (linear and orbital), size, opacity, color, rotation, and noise-based effects.
|
|
1455
|
+
* It is called once per particle per frame by the {@link updateParticleSystems} function.
|
|
1456
|
+
*
|
|
1457
|
+
* @param params - Configuration object containing:
|
|
1458
|
+
* @param params.delta - Time elapsed since the last frame in seconds. Used for velocity and rotation calculations.
|
|
1459
|
+
* @param params.generalData - Internal particle system state and cached values.
|
|
1460
|
+
* @param params.normalizedConfig - The normalized particle system configuration with all modifiers.
|
|
1461
|
+
* @param params.attributes - Three.js buffer attributes for position, size, rotation, and color.
|
|
1462
|
+
* @param params.particleLifetimePercentage - Normalized lifetime of the particle (0.0 to 1.0).
|
|
1463
|
+
* - 0.0 = particle just born
|
|
1464
|
+
* - 1.0 = particle at end of life
|
|
1465
|
+
* @param params.particleIndex - Index of the particle in the buffer arrays.
|
|
1466
|
+
*
|
|
1467
|
+
* @remarks
|
|
1468
|
+
* The function modifies the following particle properties based on configuration:
|
|
1469
|
+
*
|
|
1470
|
+
* - **Linear Velocity**: Moves particles in a straight line (velocityOverLifetime.linear)
|
|
1471
|
+
* - **Orbital Velocity**: Rotates particles around their emission point (velocityOverLifetime.orbital)
|
|
1472
|
+
* - **Size Over Lifetime**: Scales particle size based on lifetime curve (sizeOverLifetime)
|
|
1473
|
+
* - **Opacity Over Lifetime**: Fades particles in/out based on lifetime curve (opacityOverLifetime)
|
|
1474
|
+
* - **Color Over Lifetime**: Animates RGB channels independently based on lifetime curves (colorOverLifetime)
|
|
1475
|
+
* - **Rotation Over Lifetime**: Rotates particles around their center (rotationOverLifetime)
|
|
1476
|
+
* - **Noise**: Adds organic, turbulent motion to position, rotation, and size (noise)
|
|
1477
|
+
*
|
|
1478
|
+
* Each modifier only runs if it's active in the configuration, optimizing performance for simple effects.
|
|
1479
|
+
*
|
|
1480
|
+
* @example
|
|
1481
|
+
* ```typescript
|
|
1482
|
+
* // This function is called internally by updateParticleSystems
|
|
1483
|
+
* // You typically don't need to call it directly
|
|
1484
|
+
*
|
|
1485
|
+
* // However, understanding its behavior helps configure particle systems:
|
|
1486
|
+
* const config = {
|
|
1487
|
+
* sizeOverLifetime: {
|
|
1488
|
+
* isActive: true,
|
|
1489
|
+
* lifetimeCurve: {
|
|
1490
|
+
* type: 'BEZIER',
|
|
1491
|
+
* bezierPoints: [
|
|
1492
|
+
* { x: 0, y: 0, percentage: 0 }, // Start at 0% size
|
|
1493
|
+
* { x: 0.5, y: 1, percentage: 0.5 }, // Grow to 100% at midlife
|
|
1494
|
+
* { x: 1, y: 0, percentage: 1 } // Shrink to 0% at end
|
|
1495
|
+
* ]
|
|
1496
|
+
* }
|
|
1497
|
+
* },
|
|
1498
|
+
* opacityOverLifetime: {
|
|
1499
|
+
* isActive: true,
|
|
1500
|
+
* lifetimeCurve: {
|
|
1501
|
+
* type: 'EASING',
|
|
1502
|
+
* curveFunction: 'easeOutQuad'
|
|
1503
|
+
* }
|
|
1504
|
+
* }
|
|
1505
|
+
* };
|
|
1506
|
+
* ```
|
|
1507
|
+
*
|
|
1508
|
+
* @see {@link updateParticleSystems} - Calls this function for each active particle
|
|
1509
|
+
* @see {@link VelocityOverLifetime} - Configuration for velocity modifiers
|
|
1510
|
+
* @see {@link NoiseConfig} - Configuration for noise-based effects
|
|
1511
|
+
*/
|
|
1512
|
+
declare const applyModifiers: ({ delta, generalData, normalizedConfig, attributes, particleLifetimePercentage, particleIndex, }: {
|
|
1513
|
+
delta: number;
|
|
1514
|
+
generalData: GeneralData;
|
|
1515
|
+
normalizedConfig: NormalizedParticleSystemConfig;
|
|
1516
|
+
attributes: THREE.NormalBufferAttributes;
|
|
1517
|
+
particleLifetimePercentage: number;
|
|
1518
|
+
particleIndex: number;
|
|
1519
|
+
}) => void;
|
|
1520
|
+
|
|
1521
|
+
/**
|
|
1522
|
+
* Calculates random position and velocity for particles emitted from a sphere.
|
|
1523
|
+
*
|
|
1524
|
+
* Supports emission from the entire volume or just the shell of the sphere.
|
|
1525
|
+
* Uses spherical coordinates for uniform distribution across the surface.
|
|
1526
|
+
*
|
|
1527
|
+
* @param position - Output vector for the particle's starting position
|
|
1528
|
+
* @param quaternion - Rotation to apply to the emission shape
|
|
1529
|
+
* @param velocity - Output vector for the particle's initial velocity
|
|
1530
|
+
* @param speed - Speed multiplier for the velocity
|
|
1531
|
+
* @param params - Sphere configuration
|
|
1532
|
+
* @param params.radius - Radius of the sphere
|
|
1533
|
+
* @param params.radiusThickness - Controls emission from volume (1.0) vs shell (0.0)
|
|
1534
|
+
* @param params.arc - Arc angle in degrees (360 = full sphere, 180 = hemisphere)
|
|
1535
|
+
*
|
|
1536
|
+
* @remarks
|
|
1537
|
+
* - `radiusThickness = 1.0`: Emit from entire volume
|
|
1538
|
+
* - `radiusThickness = 0.0`: Emit only from surface shell
|
|
1539
|
+
* - Particles are emitted radially outward from the center
|
|
1540
|
+
*
|
|
1541
|
+
* @see {@link Sphere} - Configuration type for sphere shape
|
|
1542
|
+
*/
|
|
1543
|
+
declare const calculateRandomPositionAndVelocityOnSphere: (position: THREE.Vector3, quaternion: THREE.Quaternion, velocity: THREE.Vector3, speed: number, { radius, radiusThickness, arc, }: {
|
|
1544
|
+
radius: number;
|
|
1545
|
+
radiusThickness: number;
|
|
1546
|
+
arc: number;
|
|
1547
|
+
}) => void;
|
|
1548
|
+
/**
|
|
1549
|
+
* Calculates random position and velocity for particles emitted from a cone.
|
|
1550
|
+
*
|
|
1551
|
+
* Useful for directional particle effects like fire, smoke plumes, fountains,
|
|
1552
|
+
* or spray effects. The cone emits particles in a spreading pattern.
|
|
1553
|
+
*
|
|
1554
|
+
* @param position - Output vector for the particle's starting position
|
|
1555
|
+
* @param quaternion - Rotation to apply to the emission shape
|
|
1556
|
+
* @param velocity - Output vector for the particle's initial velocity
|
|
1557
|
+
* @param speed - Speed multiplier for the velocity
|
|
1558
|
+
* @param params - Cone configuration
|
|
1559
|
+
* @param params.radius - Base radius of the cone
|
|
1560
|
+
* @param params.radiusThickness - Controls emission from volume (1.0) vs shell (0.0)
|
|
1561
|
+
* @param params.arc - Arc angle in degrees (360 = full cone, 180 = half cone)
|
|
1562
|
+
* @param params.angle - Cone opening angle in degrees (default: 90)
|
|
1563
|
+
* Smaller values create tighter cones
|
|
1564
|
+
*
|
|
1565
|
+
* @remarks
|
|
1566
|
+
* - The cone emits from its base (circular area) outward
|
|
1567
|
+
* - Particles travel in a conical spread pattern
|
|
1568
|
+
* - `angle = 0`: Straight line (no spread)
|
|
1569
|
+
* - `angle = 90`: Wide cone
|
|
1570
|
+
* - Common for fire (10-30°), smoke (30-60°), explosions (60-90°)
|
|
1571
|
+
*
|
|
1572
|
+
* @see {@link Cone} - Configuration type for cone shape
|
|
1573
|
+
*/
|
|
1574
|
+
declare const calculateRandomPositionAndVelocityOnCone: (position: THREE.Vector3, quaternion: THREE.Quaternion, velocity: THREE.Vector3, speed: number, { radius, radiusThickness, arc, angle, }: {
|
|
1575
|
+
radius: number;
|
|
1576
|
+
radiusThickness: number;
|
|
1577
|
+
arc: number;
|
|
1578
|
+
angle?: number;
|
|
1579
|
+
}) => void;
|
|
1580
|
+
/**
|
|
1581
|
+
* Calculates random position and velocity for particles emitted from a box.
|
|
1582
|
+
*
|
|
1583
|
+
* Supports three emission modes: volume, shell (surface), and edges.
|
|
1584
|
+
* Useful for area-based effects like dust clouds, rain, or geometric patterns.
|
|
1585
|
+
*
|
|
1586
|
+
* @param position - Output vector for the particle's starting position
|
|
1587
|
+
* @param quaternion - Rotation to apply to the emission shape
|
|
1588
|
+
* @param velocity - Output vector for the particle's initial velocity
|
|
1589
|
+
* @param speed - Speed multiplier for the velocity
|
|
1590
|
+
* @param params - Box configuration
|
|
1591
|
+
* @param params.scale - Size of the box on each axis (width, height, depth)
|
|
1592
|
+
* @param params.emitFrom - Emission mode:
|
|
1593
|
+
* - `VOLUME`: Random positions throughout the entire box volume
|
|
1594
|
+
* - `SHELL`: Random positions on the 6 faces (surface)
|
|
1595
|
+
* - `EDGE`: Random positions along the 12 edges
|
|
1596
|
+
*
|
|
1597
|
+
* @remarks
|
|
1598
|
+
* - All particles emit with velocity along the +Z axis (forward)
|
|
1599
|
+
* - Box is centered at the origin before rotation
|
|
1600
|
+
* - VOLUME mode: Best for rain, snow, or volumetric clouds
|
|
1601
|
+
* - SHELL mode: Best for hollow effects or surface particles
|
|
1602
|
+
* - EDGE mode: Best for wireframe effects or particle outlines
|
|
1603
|
+
*
|
|
1604
|
+
* @see {@link Box} - Configuration type for box shape
|
|
1605
|
+
* @see {@link EmitFrom} - Emission mode enum
|
|
1606
|
+
*/
|
|
1607
|
+
declare const calculateRandomPositionAndVelocityOnBox: (position: THREE.Vector3, quaternion: THREE.Quaternion, velocity: THREE.Vector3, speed: number, { scale, emitFrom }: {
|
|
1608
|
+
scale: Point3D;
|
|
1609
|
+
emitFrom: EmitFrom;
|
|
1610
|
+
}) => void;
|
|
1611
|
+
/**
|
|
1612
|
+
* Calculates random position and velocity for particles emitted from a circle.
|
|
1613
|
+
*
|
|
1614
|
+
* Emits particles from a circular area or ring. Useful for ground impacts,
|
|
1615
|
+
* radial effects, magic circles, or any circular planar emission.
|
|
1616
|
+
*
|
|
1617
|
+
* @param position - Output vector for the particle's starting position
|
|
1618
|
+
* @param quaternion - Rotation to apply to the emission shape
|
|
1619
|
+
* @param velocity - Output vector for the particle's initial velocity
|
|
1620
|
+
* @param speed - Speed multiplier for the velocity
|
|
1621
|
+
* @param params - Circle configuration
|
|
1622
|
+
* @param params.radius - Radius of the circle
|
|
1623
|
+
* @param params.radiusThickness - Controls emission from area (1.0) vs edge (0.0)
|
|
1624
|
+
* @param params.arc - Arc angle in degrees (360 = full circle, 180 = semicircle)
|
|
1625
|
+
*
|
|
1626
|
+
* @remarks
|
|
1627
|
+
* - Circle lies in the XY plane by default (Z = 0)
|
|
1628
|
+
* - Particles emit along the +Z axis (perpendicular to circle)
|
|
1629
|
+
* - `radiusThickness = 1.0`: Filled circle (disc)
|
|
1630
|
+
* - `radiusThickness = 0.0`: Ring (circle edge only)
|
|
1631
|
+
* - Good for ground impact effects, teleport circles, or radial bursts
|
|
1632
|
+
*
|
|
1633
|
+
* @see {@link Circle} - Configuration type for circle shape
|
|
1634
|
+
*/
|
|
1635
|
+
declare const calculateRandomPositionAndVelocityOnCircle: (position: THREE.Vector3, quaternion: THREE.Quaternion, velocity: THREE.Vector3, speed: number, { radius, radiusThickness, arc, }: {
|
|
1636
|
+
radius: number;
|
|
1637
|
+
radiusThickness: number;
|
|
1638
|
+
arc: number;
|
|
1639
|
+
}) => void;
|
|
1640
|
+
/**
|
|
1641
|
+
* Calculates random position and velocity for particles emitted from a rectangle.
|
|
1642
|
+
*
|
|
1643
|
+
* Emits particles from a rectangular planar area. Useful for rain on a surface,
|
|
1644
|
+
* screen-space effects, or any planar emission pattern.
|
|
1645
|
+
*
|
|
1646
|
+
* @param position - Output vector for the particle's starting position
|
|
1647
|
+
* @param quaternion - Rotation to apply to the emission shape
|
|
1648
|
+
* @param velocity - Output vector for the particle's initial velocity
|
|
1649
|
+
* @param speed - Speed multiplier for the velocity
|
|
1650
|
+
* @param params - Rectangle configuration
|
|
1651
|
+
* @param params.rotation - Local rotation of the rectangle (degrees) before
|
|
1652
|
+
* applying quaternion
|
|
1653
|
+
* @param params.scale - Size of the rectangle (width and height)
|
|
1654
|
+
*
|
|
1655
|
+
* @remarks
|
|
1656
|
+
* - Rectangle lies in the XY plane by default
|
|
1657
|
+
* - Particles emit along the +Z axis (perpendicular to rectangle)
|
|
1658
|
+
* - The rotation parameter allows tilting the rectangle before the main
|
|
1659
|
+
* quaternion rotation is applied
|
|
1660
|
+
* - Good for rain effects, screen particles, or planar area emissions
|
|
1661
|
+
*
|
|
1662
|
+
* @see {@link Rectangle} - Configuration type for rectangle shape
|
|
1663
|
+
*/
|
|
1664
|
+
declare const calculateRandomPositionAndVelocityOnRectangle: (position: THREE.Vector3, quaternion: THREE.Quaternion, velocity: THREE.Vector3, speed: number, { rotation, scale }: {
|
|
1665
|
+
rotation: Point3D;
|
|
1666
|
+
scale: Point3D;
|
|
1667
|
+
}) => void;
|
|
1668
|
+
/**
|
|
1669
|
+
* Creates a default white circle texture using CanvasTexture.
|
|
1670
|
+
* @returns {THREE.CanvasTexture | null} The generated texture or null if context fails.
|
|
1671
|
+
*/
|
|
1672
|
+
declare const createDefaultParticleTexture: () => THREE.CanvasTexture | null;
|
|
1673
|
+
declare const isLifeTimeCurve: (value: Constant | RandomBetweenTwoConstants | LifetimeCurve) => value is LifetimeCurve;
|
|
1674
|
+
declare const getCurveFunctionFromConfig: (particleSystemId: number, lifetimeCurve: LifetimeCurve) => CurveFunction;
|
|
1675
|
+
declare const calculateValue: (particleSystemId: number, value: Constant | RandomBetweenTwoConstants | LifetimeCurve, time?: number) => number;
|
|
1676
|
+
|
|
1677
|
+
/**
|
|
1678
|
+
* Mapping of blending mode string identifiers to Three.js blending constants.
|
|
1679
|
+
*
|
|
1680
|
+
* Used for converting serialized particle system configurations (e.g., from JSON)
|
|
1681
|
+
* to actual Three.js blending mode constants.
|
|
1682
|
+
*
|
|
1683
|
+
* @example
|
|
1684
|
+
* ```typescript
|
|
1685
|
+
* import { blendingMap } from '@newkrok/three-particles';
|
|
1686
|
+
*
|
|
1687
|
+
* // Convert string to Three.js constant
|
|
1688
|
+
* const blending = blendingMap['THREE.AdditiveBlending'];
|
|
1689
|
+
* // blending === THREE.AdditiveBlending
|
|
1690
|
+
* ```
|
|
1691
|
+
*/
|
|
1692
|
+
declare const blendingMap: {
|
|
1693
|
+
'THREE.NoBlending': 0;
|
|
1694
|
+
'THREE.NormalBlending': 1;
|
|
1695
|
+
'THREE.AdditiveBlending': 2;
|
|
1696
|
+
'THREE.SubtractiveBlending': 3;
|
|
1697
|
+
'THREE.MultiplyBlending': 4;
|
|
1698
|
+
};
|
|
1699
|
+
/**
|
|
1700
|
+
* Returns a deep copy of the default particle system configuration.
|
|
1701
|
+
*
|
|
1702
|
+
* This is useful when you want to start with default settings and modify specific properties
|
|
1703
|
+
* without affecting the internal default configuration object.
|
|
1704
|
+
*
|
|
1705
|
+
* @returns A new object containing all default particle system settings
|
|
1706
|
+
*
|
|
1707
|
+
* @example
|
|
1708
|
+
* ```typescript
|
|
1709
|
+
* import { getDefaultParticleSystemConfig, createParticleSystem } from '@newkrok/three-particles';
|
|
1710
|
+
*
|
|
1711
|
+
* // Get default config and modify it
|
|
1712
|
+
* const config = getDefaultParticleSystemConfig();
|
|
1713
|
+
* config.emission.rateOverTime = 100;
|
|
1714
|
+
* config.startColor.min = { r: 1, g: 0, b: 0 };
|
|
1715
|
+
*
|
|
1716
|
+
* const { instance } = createParticleSystem(config);
|
|
1717
|
+
* scene.add(instance);
|
|
1718
|
+
* ```
|
|
1719
|
+
*/
|
|
1720
|
+
declare const getDefaultParticleSystemConfig: () => any;
|
|
1721
|
+
/**
|
|
1722
|
+
* Creates a new particle system with the specified configuration.
|
|
1723
|
+
*
|
|
1724
|
+
* This is the primary function for instantiating particle effects. It handles the complete
|
|
1725
|
+
* setup of a particle system including geometry creation, material configuration, shader setup,
|
|
1726
|
+
* and initialization of all particle properties.
|
|
1727
|
+
*
|
|
1728
|
+
* @param config - Configuration object for the particle system. If not provided, uses default settings.
|
|
1729
|
+
* See {@link ParticleSystemConfig} for all available options.
|
|
1730
|
+
* @param externalNow - Optional custom timestamp in milliseconds. If not provided, uses `Date.now()`.
|
|
1731
|
+
* Useful for synchronized particle systems or testing.
|
|
1732
|
+
*
|
|
1733
|
+
* @returns A {@link ParticleSystem} object containing:
|
|
1734
|
+
* - `instance`: The THREE.Object3D that should be added to your scene
|
|
1735
|
+
* - `resumeEmitter()`: Function to resume particle emission
|
|
1736
|
+
* - `pauseEmitter()`: Function to pause particle emission
|
|
1737
|
+
* - `dispose()`: Function to clean up resources and remove the particle system
|
|
1738
|
+
*
|
|
1739
|
+
* @example
|
|
1740
|
+
* ```typescript
|
|
1741
|
+
* import { createParticleSystem, updateParticleSystems } from '@newkrok/three-particles';
|
|
1742
|
+
*
|
|
1743
|
+
* // Create a basic particle system with default settings
|
|
1744
|
+
* const { instance, dispose } = createParticleSystem();
|
|
1745
|
+
* scene.add(instance);
|
|
1746
|
+
*
|
|
1747
|
+
* // Create a custom fire effect
|
|
1748
|
+
* const fireEffect = createParticleSystem({
|
|
1749
|
+
* duration: 2.0,
|
|
1750
|
+
* looping: true,
|
|
1751
|
+
* startLifetime: { min: 0.5, max: 1.5 },
|
|
1752
|
+
* startSpeed: { min: 2, max: 4 },
|
|
1753
|
+
* startSize: { min: 0.5, max: 1.5 },
|
|
1754
|
+
* startColor: {
|
|
1755
|
+
* min: { r: 1.0, g: 0.3, b: 0.0 },
|
|
1756
|
+
* max: { r: 1.0, g: 0.8, b: 0.0 }
|
|
1757
|
+
* },
|
|
1758
|
+
* emission: { rateOverTime: 50 },
|
|
1759
|
+
* shape: {
|
|
1760
|
+
* shape: Shape.CONE,
|
|
1761
|
+
* cone: { angle: 10, radius: 0.2 }
|
|
1762
|
+
* }
|
|
1763
|
+
* });
|
|
1764
|
+
* scene.add(fireEffect.instance);
|
|
1765
|
+
*
|
|
1766
|
+
* // In your animation loop
|
|
1767
|
+
* function animate(time) {
|
|
1768
|
+
* updateParticleSystems({ now: time, delta: deltaTime, elapsed: elapsedTime });
|
|
1769
|
+
* renderer.render(scene, camera);
|
|
1770
|
+
* }
|
|
1771
|
+
*
|
|
1772
|
+
* // Clean up when done
|
|
1773
|
+
* fireEffect.dispose();
|
|
1774
|
+
* ```
|
|
1775
|
+
*
|
|
1776
|
+
* @see {@link updateParticleSystems} - Required function to call in your animation loop
|
|
1777
|
+
* @see {@link ParticleSystemConfig} - Complete configuration options
|
|
1778
|
+
*/
|
|
1779
|
+
declare const createParticleSystem: (config?: ParticleSystemConfig, externalNow?: number) => ParticleSystem;
|
|
1780
|
+
declare const updateParticleSystems: (cycleData: CycleData) => void;
|
|
1781
|
+
|
|
1782
|
+
export { type BezierCurve, type BezierPoint, type Box, type Burst, type BurstState, type Circle, type Cone, type Constant, type CurveBase, type CurveFunction, CurveFunctionId, type CycleData, type EasingCurve, type Emission, EmitFrom, type GeneralData, LifeTimeCurve, type LifetimeCurve, type MinMaxColor, type Noise, type NoiseConfig, type NormalizedParticleSystemConfig, type ParticleSystem, type ParticleSystemConfig, type ParticleSystemInstance, type Point3D, type RandomBetweenTwoConstants, type Rectangle, type Renderer, type Rgb, Shape, type ShapeConfig, SimulationSpace, type Sphere, type TextureSheetAnimation, TimeMode, type Transform, type VelocityOverLifetime, applyModifiers, blendingMap, calculateRandomPositionAndVelocityOnBox, calculateRandomPositionAndVelocityOnCircle, calculateRandomPositionAndVelocityOnCone, calculateRandomPositionAndVelocityOnRectangle, calculateRandomPositionAndVelocityOnSphere, calculateValue, createBezierCurveFunction, createDefaultParticleTexture, createParticleSystem, getBezierCacheSize, getCurveFunction, getCurveFunctionFromConfig, getDefaultParticleSystemConfig, isLifeTimeCurve, removeBezierCurveFunction, updateParticleSystems };
|