Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/joshbrew/dynamicparticles.js
Dynamic particle rendering. Make groups of particles and set custom rulesets. Comes with efficient boids (20K rendered in ThreeJS @60fps) and a toggleable default canvas renderer built in for quick testing.
https://github.com/joshbrew/dynamicparticles.js
3d-graphics canvas particles vector-math
Last synced: about 2 months ago
JSON representation
Dynamic particle rendering. Make groups of particles and set custom rulesets. Comes with efficient boids (20K rendered in ThreeJS @60fps) and a toggleable default canvas renderer built in for quick testing.
- Host: GitHub
- URL: https://github.com/joshbrew/dynamicparticles.js
- Owner: joshbrew
- License: mit
- Created: 2021-07-02T20:54:06.000Z (over 3 years ago)
- Default Branch: main
- Last Pushed: 2022-02-24T23:11:00.000Z (almost 3 years ago)
- Last Synced: 2024-11-15T21:08:22.458Z (2 months ago)
- Topics: 3d-graphics, canvas, particles, vector-math
- Language: JavaScript
- Homepage:
- Size: 6.49 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
## DynamicParticles.js
This is a little experimental particle vector calculator. It lets you quickly generate groups of particles with specified rulesets.
It comes with boids by default, they are very efficient and I had 10,000 on screen by reducing the group search count per boid, and the canvas was by far the limiting factor. will add more in time to replicate some stuff I saw on youtube. Just open the particleTest.html file to see and tinker with this:
https://user-images.githubusercontent.com/18196383/124330212-c9354200-db41-11eb-99c9-c73f86fdce3c.mp4
3D example
https://app.brainsatplay.com/#Boids![birdmoney](https://user-images.githubusercontent.com/18196383/124544444-f735b300-dddb-11eb-84f9-647736994b45.png)
Example Usage:
`npm i dynamicparticles`
HTML:
```
```
JS:
```
import {DynamicParticles} from 'dynamicparticles'let canvas = document.getElementById('canvas');
let Particles = new DynamicParticles(
[
['boids',1000],
['boids',300],
['boids',800]
],
canvas,
true
);Particles.addRule( //See code for example functions
'newrule',
(particle,rule)=>{}, //groupRuleGen (called when a particle is created): particle format: See DynamicParticles.prototype (line 29); rule format: [type='type',count=500]
(group,timeStep)=>{}, //timestepFunc (called each frame): group format: [{particle0},{particle1},...{particleN}]; timeStep: seconds between frames
(particle)=>{} //animateParticle (called per particle per frame): particle format: See DynamicParticles.prototype (line 29)
);
Particles.addGroup(['newrule',300]);```