Hi,
I have worked on this simulation with three.js and webgl which works fine :
I have understood many things but not everything. I would like to know if it’s possible to follow the shift of a single point (like a bottle cap). For this, It would be logical to do something like position_new=position_old+velocity*dt in a shader.
I don’t know how to store this “position_old” on each iteration, I tried to output it from a shader and to store it in a fbo like all other values (pressure, velocity,…) but it doesn’t work.
If you manage to solve that if 5 minutes, it’s cool.
I think you want to set up a second simulation for the particles.
It has 2 rendertargets… (FloatType, or HalfFloatType)
first rendertarget stores current particle position… .
second rendertarget stores new particle position.
shader processes first rendertarget… reads the point… reads velocity from fluid simulation rendertarget (bound as a uniform sampler2D), adds to position, and writes out to second rendertarget… then the rendertargets are swapped.
Next you set up the particle renderer…
the particle renderer, reads from the particle position target (in the vertex shader) to draw the particle.
Thanks for your answer. Actually I have understood how it should work but I have problem about how flows the information between each shaders and classes in the application at every cycle. I am actually only used to work with three fiber and I am not confortable with javascript class. Do you mind if I give you a link to what I have done ? There’s only a few modification compare to the original and the code is very clean.
Tell me if it doesn’t work. I added a class named Deplacement. It is supposed to sum up a small amount of velocity on each iteration (in the update method on the class Simulation). The shader of Deplacement is supposed to update the deplacement value in the fbo (not working I think)
The colors you see come from the file color.frag. I divided it in 2, left part original solution, right part it’s mine. We see no difference actually so the value deplacement is not updated on each iteration, we only see last velocity calculated.
output.js get the output of simulation.js where the main things happened.
The velocity is coming from pression.js and also advection.js.
If you want to see the output of the shader of each class, you can go to the file shaderpass.js where there is a console.log
I also added a little zone in the center of the screen with no pression and no velocity, it can be confusing.
