dynamicparticles
Advanced tools
Dynamic particle rendering. Make groups of particles and set custom rulesets. Comes with efficient boids (3.2K rendered in a canvas @60fps) and a toggleable default canvas renderer built in for quick testing.
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:
3D example https://app.brainsatplay.com/#Boids
Example Usage:
npm i dynamicparticles
HTML:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
</head>
<body>
<canvas id='canvas' style='width:80vw;height:80vh;'></canvas>
</body>
</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]);
FAQs
Dynamic particle rendering. Make groups of particles and set custom rulesets. Comes with efficient boids (3.2K rendered in a canvas @60fps) and a toggleable default canvas renderer built in for quick testing.
We found that dynamicparticles demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Research
/Security News
Impostor NuGet package Tracer.Fody.NLog typosquats Tracer.Fody and its author, using homoglyph tricks, and exfiltrates Stratis wallet JSON/passwords to a Russian IP address.
Security News
Deno 2.6 introduces deno audit with a new --socket flag that plugs directly into Socket to bring supply chain security checks into the Deno CLI.
Security News
New DoS and source code exposure bugs in React Server Components and Next.js: what’s affected and how to update safely.