CODEWITHSUNDEEP
webglthree.js
George Neil
George Neil

Reputation: 367

How to do Maximum Intensity Projection [ MIP ] in WebGL

I have created a demo [ http://jsfiddle.net/georgeneil/cfrsj/16/ ] using three.js which performs blending, ie THREE.AdditiveBlending. But this is giving me a white light effect and hence a feeling of loss of information.

What i need a blended result which can project the Maximum Intensity. How can i do this using three.js ?

In OpenGL i was able to do this using glBlendEquationEXT(GL_MAX_EXT).

I have updated the demo [ http://jsfiddle.net/georgeneil/cfrsj/21 ], to make the concept more clear. Now there are 8 particles, 4 are RED color and remaining 4 are black color. If MIP works properly we could see only the RED particles even when BLACK overlaps RED enter image description here

What i am looking for can be explained from this demo [ http://jsfiddle.net/georgeneil/cfrsj/28/ ]. I need to see black pixels where ever its NOT overlaping with the Red pixel. I need to get effects as shown in the attached image.enter image description here

Upvotes: 2

Views: 1568

Answers (3)

Tisys
Tisys

Reputation: 948

You could be interested in the two following links:

Upvotes: 0

Gero3
Gero3

Reputation: 2887

If I understood your question then this should be a correct solution.

http://jsfiddle.net/cfrsj/26/

Edit:

This is how I simulated the function. I use NormalBlending.

first I make sure that the colors saturate with 

    float r= vColor.r > 0.0? 1.0 : 0.0;
    float g= vColor.g > 0.0? 1.0 : 0.0; 
    float b= vColor.b > 0.0? 1.0 : 0.0;

then I check if alpha is nessecary with 

    gl_FragColor.a = gl_FragColor.a * 
                     texture2D( texture, gl_PointCoord ).r * 
                     (test.r > 0.0 ? 1.0 : 
                         (test.g > 0.0?1.0:
                         (test.b > 0.0?1.0:0.0)));

Upvotes: 1

Roest
Roest

Reputation: 818

That's a bug in webgl. A workaround is to initialize gl with

gl = canvas.getContext("experimental-webgl", { alpha: false } );

Upvotes: 0

Related Questions