PixiJS Particle System

A modern, flexible particle system for PixiJS - a spiritual successor to Particle Emitter, but rebuilt with a clean TypeScript-first architecture and more expressive API.

Features

• Built for PixiJS, provides seamless integration with V8's ParticleContainer and Particle objects.
• Provides strong typing, great IntelliSense and predictable API.
• Behavior orientated design allows for pluggable behaviors for custom effects.
• Flexible yet simple API, start small and scale up to advanced usage.
• Optimized for real-time effects.
• Comes with built-in behaviors to get started immediately:
  • AlphaBehavior
  • ColorBehavior
  • MovementBehavior
  • RotationBehavior
  • ScaleBehavior
  • SpawnBehavior
  • TextureBehavior

Getting Started

Add the library to existing PixiJS project:

npm i pixi-particle-system

Usage

Here's the minimum required to get particles on the screen:

import { Emitter } from "pixi-particle-system";
import { ParticleContainer } from "pixi.js";

// Create a particle container and add it to your app/stage
const container = new ParticleContainer();
app.stage.addChild(container);

// Create an emitter (the "brain" of the particle system)
const emitter = new Emitter(container);

// Start emitting particles
emitter.play();

Emitter automatically attaches itself to the PixiJS shared ticker, so you just need to tell it when to start/stop and everything else is handled for you!

By default particles will spawn in a single point, and they are using a 1x1 white texture (Texture.WHITE) - depending on your setup, you might need to either use a custom texture, or increase scale using ScaleBehavior to see them better.

Contributing

Contributions are what make the open source community an amazing place to learn, inspire, and create. Any contributions you make are greatly appreciated.

If you have a suggestion that would make this project better, please fork the repo and create a pull request. You can also simply open an issue with the relevant tag. Don't forget to give the project a star! Thank you! ❤️

See CONTRIBUTING for more information about contributions.

Releases

Visit RELEASES to see previous releases, changelog, and the latest release.

License

Distributed under the MIT License. See LICENSE for more information.

Acknowledgements

Thank you to the PixiJS team, and it's contributors, for making a great web graphics framework. Thank you to CloudKid, and all of the contributors, for creating the original particle-emitter package - this one wouldn't exist without it.