tweening particles in buffergeometry

Question

This question piggybacks on the following questions:

Three.js - Buffer geometry particles, need to animate random groups of particles in system

How to quickly update a large BufferGeometry?

I'm starting a new project that will have tens of thousands of particles in the scene at any time. The concept is that there will be clusters of particles that look like galaxies spread throughout the scene. Sometimes I will need animate a galaxy and its thousands of particles. Can I do this while the geometry is still within a buffer?

I'm using a PointCloud constructed using THREE.BufferGeometry, with each vertices position set using Float32Array( numParticles * 3 ).

In the past I've always used tween.js to animate objects moving around in my scenes. Is it possible to extract out the points required for tweening, convert to vector3, reposition them, and render on every update loop?

Answer 1

If you want to animate tens of thousands of particles, then perform your simulation on the GPU, and displace the positions of your particles in the vertex shader. The buzzword you can google is "GPGPU".

You have lots of options: the logic can be entirely within the shader, and/or you can pass updated control uniforms to the shader, and/or you can pass attributes to the shader.

Here is a three.js example: http://threejs.org/examples/webgl_gpgpu_birds.html

And here is an example using particles: http://www.neveroccurs.com/lab/three.js/gpu_particles/?particles=256

three.js r.69