I have created a particle system which movement is controlled by a flow field over perlin noise - Available here.

I would be very thankful for any ideas and tips how to control their movement on the Z-plane (noise is 3d), as my 3d knowledge is still very poor.

How to describe the movement controlled by noise value in the third dimension? I guess the displacement has to be described by a vector directing the movement and added to current possition, but how to determine the z component?

3d example video is available here

  • \$\begingroup\$ what should I answer insteal of, "proceed with z analogous to x and y". If you have a 3d Perlin as you mentionend, use that z component from your noise function in the same way as you used your x and y components. \$\endgroup\$
    – Arne
    Jan 20, 2014 at 1:28
  • \$\begingroup\$ For particle flows, you may also be interested in Curl Noise cs.ubc.ca/~rbridson/docs/bridson-siggraph2007-curlnoise.pdf - this generates a divergence-free vector field analogous to turbulence in fluids with low compressibility (like water), which reduces the tendency of particles to clump-together into threads as shown in your demo. \$\endgroup\$
    – DMGregory
    Jan 23, 2014 at 16:14
  • \$\begingroup\$ @mjanisz1: wow, your demo looks much cooler now! \$\endgroup\$
    – lot
    Jan 27, 2014 at 15:41
  • \$\begingroup\$ @DMGregory Do you happen to have some algorithm implementation of this Curl noise? It looks neat, but I don't feel like coding it myself :-] \$\endgroup\$
    – lot
    Jan 27, 2014 at 15:42
  • \$\begingroup\$ @lot thanks, still trying to tweak it a bit. Now im struggling how to move it to the gpu to make more particles \$\endgroup\$
    – mjanisz1
    Jan 27, 2014 at 17:20

1 Answer 1


In your code, you always set z portion of each particle position to 0. Same thing that you've done for x and y do now for z and you are all set, I guess. That means most of all - create third instance of SimplexNoise and use it to calcualte z position in your animation() function.

Then add something like FirstPersonControls.js so viewer can actually enjoy third dimension.


You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .