Reputation: 157
I'm re-using the simple example from http://www.html5rocks.com/en/tutorials/webgl/webgl_fundamentals/webgl/webgl-2d-image.html to load a 16*16 png, which is completely black, except one point in there, which I set the RGB value to 0,0,202 using paint.
In the above example, I've also changed the fragment shader to
vec4 x=floor(texture2D(u_image,v_texCoord).rgba*255.0);
if(x==vec4(48.0,0.0,220.0,255))
{ gl_FragColor = vec4(1.0,vec2(0.0),1.0);}
else
{ gl_FragColor = vec4(vec3(x),1.0);}
For some reasons I'm getting RGB=48,0,220 instead of 0,0,202 as initially expected?
here is my png you can save locally...
Upvotes: 2
Views: 795
Reputation: 157
I found the problem on my own.
WebGL does use pre-multiplied alpha values and also apply some color space conversion.
Pre-multiplied alpha can be disabled using: gl.pixelStorei(gl.UNPACK_PREMULTIPLY_ALPHA_WEBGL, false);
Color space conversions can be disabled using: gl.pixelStorei(gl.UNPACK_COLORSPACE_CONVERSION_WEBGL, false);
You need to call both of those functions before you upload your texture.
Thanks to this post http://games.greggman.com/game/webgl-image-processing/
Upvotes: 3