View Full Version : How to use transparency?

10-17-2011, 09:01 AM

I am sorry if this question is not advanced enough to be posted here :) I posted in the beginner section and didn't get any response...

I want to use transparency in webgl with only color and no texture. I found some tutorial online talking about how to do this using blending with texture. If I just use the RGBA color and change the alpha value, how can I enable the transparency? I tried it without blending and the color is just becoming gray but not transparent. With blending I found that the objects with alpha value as 1 also shown as transparent. Please help me with this question. Thank you very much!

Best wishes,

Ambit Energy
10-17-2011, 02:37 PM
This looks like a depth buffering issue to me you start with a white background, draw the thing with the border so that it's composited on the white, then draw the thing behind the thing with the border. Those areas where the border was blended with the original white background will have stored a value in the depth buffer equal to the depth of their plane, so when the object behind is subsequently drawn, its pixels are discarded in that area.

The general rule is to draw transparent objects after opaque objects, usually from back to front. If you're using additive blending then it's often good enough to disable the depth buffer after the opaque draw and draw them in any order.

John Galt
Ambit Energy, Sales Consultant
St. Louis, Missouri