diff --git a/site/docs/12-other/13-particles.mdx b/site/docs/12-other/13-particles.mdx index da5af295d..85839a429 100644 --- a/site/docs/12-other/13-particles.mdx +++ b/site/docs/12-other/13-particles.mdx @@ -11,29 +11,74 @@ Particles can be used to generate dust, smoke, or fire effects in your games. The easiest way to create a [[ParticleEmitter]] is to use the [Particle Tester](https://excaliburjs.com/particle-tester/) to generate code for emitters. +:::warning +The particle tester constructor is currently out of date, you will need to modify it to match the below. +::: + ### Example: Adding an emitter ```js const actor = new ex.Actor(...); -const emitter = new ex.ParticleEmitter(...); -emitter.emitterType = ex.EmitterType.Circle; // Shape of emitter nozzle -emitter.radius = 5; -emitter.minVel = 100; -emitter.maxVel = 200; -emitter.minAngle = 0; -emitter.maxAngle = Math.PI * 2; -emitter.emitRate = 300; // 300 particles/second -emitter.opacity = 0.5; -emitter.fadeFlag = true; // fade particles overtime -emitter.particleLife = 1000; // in milliseconds = 1 sec -emitter.maxSize = 10; // in pixels -emitter.minSize = 1; -emitter.particleColor = ex.Color.Rose; -// set emitter settings -emitter.isEmitting = true; // should the emitter be emitting +const emitter = new ParticleEmitter({ + x: 100, + y: 100, + radius: 5, + emitterType: ex.EmitterType.Circle, // Shape of emitter nozzle + minVel: 100, + maxVel: 200, + minAngle: 0, + maxAngle: Math.PI * 2, + isEmitting: true, // should the emitter be emitting + emitRate: 300, // 300 particles/second + opacity: 0.5, + fadeFlag: true, // fade particles overtime + particleLife: 1000, // in milliseconds = 1 sec + minSize: 1, // random size minimum in pixels + maxSize: 10, // random size maximum in pixels + startSize: 10, // starting size in pixels + endSize: 1, // ending size in pixels + acceleration: new Vector(accelX, accelY), + beginColor: ex.Color.Red, + endColor: ex.Color.Blue, + focusAccel: 800 +}); // add the emitter as a child actor, it will draw on top of the parent actor // and move with the parent actor.add(emitter); // or, alternatively, add it to the current scene engine.add(emitter); ``` + +### 🧪 Alpha Particle Emitter + +In the latest build particle specific properties are nested under the `particle` config + +```typescript +const emitter = new ParticleEmitter({ + x: game.halfDrawWidth, + y: game.halfDrawHeight, + width, + height, + emitterType, + radius, + isEmitting, + emitRate, + focusAccel: 800, + particle: { + minVel, + maxVel, + minAngle, + maxAngle, + opacity, + fade, + life, + minSize, + maxSize, + startSize, + endSize, + acc: new Vector(accelX, accelY), + beginColor: ex.Color.Red, + endColor: ex.Color.Blue, + } +}); +``` \ No newline at end of file