• Stars
    star
    850
  • Rank 53,628 (Top 2 %)
  • Language
    JavaScript
  • License
    MIT License
  • Created over 11 years ago
  • Updated about 2 years ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

A GLSL-heavy particle engine for THREE.js. Originally based on Stemkoski's great particle engine (see README)

Shader Particle Engine v1.0.6

Overview

The purpose of this library is to make creating particle effects using THREE.js and WebGL as simple as possible. The heavy-lifting is done by the GPU, freeing up CPU cycles.

Emitters are created by first creating an instance of SPE.Group. It is in the group where ShaderMaterial settings are applied, and the texture for all emitters added to that group is set. Multiple groups can be created, but if efficiency is a high-priority then as few groups as possible should be created. The group takes care of uploading emitter data to the GPU for simulation and rendering, so the fewer chunks of data that get sent the better.

Once a group has been created, an instance of SPE.Emitter can then be added to it. Each emitter can have its own behaviour and appearance.

For more information on groups and emitters, see the docs below:

Examples can be found here

Dependencies

  • THREE.js r72+ (preferably r81+).

Changelog

A full changelog can be seen here.

A migration log can be found here.

Documentation

A massive improvement over the previous versions of this library is actual documentation! I'll be working on making some tutorials, and adding presets and more examples in the very near future.

  • Full api documentation (created using the wonderful JSDoc) is available here.

  • An annotated version of the library (created using the equally wonderful Docco) can be found here.

Building

This project uses Grunt to create the distributions, one dev build (not minimized) and one production build (minimized). If you make changes and want to build it, follow these steps:

If you don't have grunt installed, first make sure you've got NodeJS and NPM installed, then install Grunt CLI. You might have to do this as root:

npm install -g grunt-cli

Now you can install the local grunt package:

cd [projectFolder] && npm install && grunt

The output of grunt will sit in the build folder.

Thanks

Huge thanks to Stemkoski for the initial inspiration for this library. A lot has changed since the project first began, but it wouldn't have existed without his initial work and help. Big thanks to everyone involved in THREE.js, too.

Thanks to @giuliandrimba for the bower.json PR.

More Repositories

1

THREE.TargetCamera

A dual-mode (first- and third-person) chase-style camera for THREE.js
HTML
28
star
2

AudioIO

A modular component system for building complex instruments, effects, and audio signal graphs using the WebAudio API.
JavaScript
17
star
3

WebGL-Game-Framework

A helper framework to aid code organisation when writing games in WebGL using THREE.js
JavaScript
9
star
4

THREE.ObjectControls

A six-axis-of-freedom movement helper for THREE.js.
JavaScript
9
star
5

audio.io-old

A (possibly overkill) web audio and MIDI helper library
JavaScript
6
star
6

BirdFlight

A simple bird flight animation for canvas.
JavaScript
5
star
7

aStar

Trying to learn A* Pathfinding...
JavaScript
4
star
8

Game-Framework

Canvas-orientated game framework
JavaScript
3
star
9

Canvas-Forces

Collision experiments
JavaScript
3
star
10

THREE.SimulationRenderer

A re-write of @zz85's Simulation Renderer for THREE.js
JavaScript
3
star
11

shader-particle-engine-2

An experimental particle engine for ThreeJS using GPGPU
TypeScript
3
star
12

Canvas-3D

Simple 3d perspective projection experiment
2
star
13

CorrectingTimer

A self-correcting JS timer. Replacement for setInterval.
JavaScript
2
star
14

Canvas-Circles-Animation

Playing around with Robert Penner's easing equations...
JavaScript
2
star
15

DoxToWiki

A quick 'n' dirty (read: proof-of-concept) auto documenting tool, using VisionMedia's `dox` package for Node.
JavaScript
2
star
16

0hGameJam2013

My entry for the 0h Game Jam, 2013. http://0hgame.eu/
1
star
17

BehaviourPlayground

JavaScript
1
star
18

squarefeet.github.io

CSS
1
star
19

DIVISI

DIVISI is a WebMIDI helper library to transform MIDI messages.
JavaScript
1
star
20

webgl-glsl-unit-test

A helper to enable unit testing of GLSL code using Three.js / WebGL
TypeScript
1
star
21

SingleRoomMultiplayer

A single room multiplayer experiment
JavaScript
1
star
22

Canvas-Text-Editor

An old experiment to make a text editor in canvas.
JavaScript
1
star
23

web-audio-worklet-grainstates

Granular Sampler using an Audio Worklet
TypeScript
1
star
24

Password-Generator

Simple password generator.
JavaScript
1
star
25

Grunt-FrontEnd-Template

A front-end template that uses Grunt to create both development and production versions of a source directory.
JavaScript
1
star