process array data with WebGL shader

Question

Right now I am doing a lot of CPU intensive calculation to find certain set of vertices in my very complex data structure. Once I "found" these I go on rendering them with WebGL... I would like to use the GPU as a means for "parallelization" here.

I was wondering wether there is good way to process this data directly on the shader and use its result to render stuff. I would need it input a large array of arrays to the shader (uniforms!?) and probably keep the result of the calculations constant for every vertex that is processed by the shader.

Maybe it would be a good idea to represent all my data as a texture to input it into the shader. Can one do "look ups" on textures?

I hope that you understand my question and look forward to your thoughts on this!

Yes, you can lookup values from a texture in a shader (that's pretty much the only thing you can do with them). Otherwise your question is pretty vague, it's not clear what your specific question is. If you're just looking for a general 'how do I do shaders' kind of tutorial you might want to look for a tutorial elsewhere. — Tim

MikaelEmtinger MikaelEmtinger · Accepted Answer · 2012-04-18T12:08:15

You can look at a texture as an array of data and have a shader reading from that texture, process the information and write the result to another texture (hooked to a frame buffer). If you like to use the result in the next frame, you simple swap the textures.

Here's an example, quite long and complicated though, that shows how to calculate particles entirely using shaders:

http://i-am-glow.com/?page_id=183

You can also read the code, which is quite well documented, here:

http://empaempa.github.com/GLOW/examples/complicated/Complicated.js

Hope that helps!

process array data with WebGL shader

1 Answers