Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up
Appearance settings

leonlaser/p5js-particle-flowfield

Folders and files

NameName
Last commit message
Last commit date

Latest commit

History

5 Commits

Repository files navigation

P5.js Particle Flowfield Animation

Flowfield animation demo

A flowfield based animation realized by moving particles over a grid based field. It works similar to a flow field It renders much faster than my first attempt. This one is using an approach used in The Coding Train's coding challange #24.

You are able to change some basic parameters:

DEBUG enables you to display the flowfield and renders particles a without trails.

FLOW_TILE_SIZE sets the flowfield resolution by defining the size of a tile.

FLOW_TILE_INFLUENCE defines how strong a particle is moved by the field. While moving over a tile of the flowfield, the particles current direction is slowly interpolated towards the given direction of the flowfield. Define the amount of each interpolation step for each frame.

FLOW_TILE_MOVEMENT how fast the flowfield changes over time.

PARTICLES_NUMBER how many particles to render on screen. When a particles leaves the screen, a new one is created.

PARTICLES_MAX_MAGNITUDE how fast a particle can be. Is randomly chosen between 2 and this value.

Made with P5.js.

Click here to show in your browser.

About

P5.js flowfield animation/simulation with particles

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Contributors 2

AltStyle によって変換されたページ (->オリジナル) /