Ajax Loader
×

Canvas - Wavey Particles Motion

Wavey particles motion by using simple Sine and Cosine functions. To create this motion, the x coordinate of the particles is incremented by a constant Sine function while the y coordinate of the particles is incremented by varying Cosine function to create the wave horizontally. You can also create vertical wave motion by keeping cosine constant and varying the sine function.

p.x += Math.sin(1.4);
p.y += Math.cos(counter * Math.PI/p.angle);

Related:

×

Coding Preferences


HTML

CSS

Javascript

More

×

Your Default Settings - Preferences

×
×
×

Validations

(Errors from your JS or Pre-Processors code)

    HTML
    CSS
    JavaScript

    Canvas - Wavey Particles Motion

    CSSDeck G+