2
votes

I am interested in performing some intensive calculations in webgl, so its run on GPU.

Most of the docs speak about how render graphics though.

I am after very simple task: for given image, transform it to grayscale, and find coordinates of local maxima (pixels that are brighter than its neighbours).

I would like to run the 'loops' in webgl shader, but getting out the (x, y) of the local maxima pixels to the javascript world. Is it doable? Whats the best way to do it, so that it performs well by processing pixels in parallel?

1
I don't know if this applies to your case, but it looks like you want to learn how to do GPGPU, and this tutorial was my starting point: mathematik.uni-dortmund.de/~goeddeke/gpgpu/tutorial.html. It's not on OpenGL ES, but may be useful... - Pedro Boechat
WebGL is an API for the limited graphic pipeline of the GPU (as opposed to CUDA or OpenCL) so if you want to go the parallel computing route look into HTML Web Workers - FrickeFresh

1 Answers

3
votes

You can render full-screen quad with shader that sample pixels from your texture(image) in some square(like 4x4 or 16x16 resolution limited by maximal amount of texture samples) and output maximal value as fragment color + maximal pixel texture coordinate(if needed) to the lower resolution texture. So you will have reduced image. You can iterate this to achieve global maximum.

Read this http://www.lcg.ufrj.br/Cursos/GPUProg/GPGPU_Reductions