astrosat / windgl

A WebGL wind particle simulation as a Mapbox custom layer
https://astrosat.github.io/windgl/
ISC License
169 stars 44 forks source link

Particle trails #20

Open timeroute opened 5 years ago

timeroute commented 5 years ago

how can i draw particle trails? just like the demo of mapbox/webgl-wind.

gampleman commented 5 years ago

At the moment this isn't supported.

In order to do that ala mapbox/webgl-wind, you need to render the output to a framebuffer and fade it out progressively over time. This has the following negative consequences in a full featured implementation:

  1. The output is completely wrong when panning/zooming, so you have to throw it out. This leads to a somewhat disconcerting effect where every time you move the map, all the particle trails disappear only to show up a few seconds later.
  2. This limits the speed of the particle: it cannot travel more than a single pixel per frame, otherwise the particle trail develops holes, breaking the visual effect.

In the longer term we can develop some solutions to this. My thoughts went something like this:

  1. choose a number of frames that we will have a particle trail for, call it n.
  2. allocate n + 1 textures to hold particle positions.
  3. on a normal frame, compute the current position based on frame n, shift the textures around one position and store it frame n
    • on a frame where a zoom/pan has occurred, recompute the position for all n. This will be slow, so this needs to put a limit on the size of n
  4. When drawing to the screen, draw in line mode, drawing a segment of the line between pairs of frames.
Robert-OP commented 3 years ago

At the moment this isn't supported.

In order to do that ala mapbox/webgl-wind, you need to render the output to a framebuffer and fade it out progressively over time. This has the following negative consequences in a full featured implementation:

  1. The output is completely wrong when panning/zooming, so you have to throw it out. This leads to a somewhat disconcerting effect where every time you move the map, all the particle trails disappear only to show up a few seconds later.
  2. This limits the speed of the particle: it cannot travel more than a single pixel per frame, otherwise the particle trail develops holes, breaking the visual effect.

In the longer term we can develop some solutions to this. My thoughts went something like this:

  1. choose a number of frames that we will have a particle trail for, call it n.
  2. allocate n + 1 textures to hold particle positions.
  3. on a normal frame, compute the current position based on frame n, shift the textures around one position and store it frame n

    • on a frame where a zoom/pan has occurred, recompute the position for all n. This will be slow, so this needs to put a limit on the size of n
  4. When drawing to the screen, draw in line mode, drawing a segment of the line between pairs of frames.

thanks @gampleman for your work up until now on this, one question:

would this feature require to continue with webgl implementation?

gampleman commented 3 years ago

would this feature require to continue with webgl implementation?

Not totally sure what you mean by that?

Robert-OP commented 3 years ago

would this feature require to continue with webgl implementation?

Not totally sure what you mean by that?

so, in order to implement the particle trails feature is it needed for one to know more how to work with webgl?

gampleman commented 3 years ago

Yes. I'm afraid that to do anything interesting inside this repo fairly decent knowledge of WebGL is required.

Robert-OP commented 3 years ago

thank you @gampleman - would you be interested to develop this feature forward if sponsored?