Jump to content

Behaviour of alpha in fragment shaders


Recommended Posts

You can specify "texture.baseTexture.pmaMode = PIXI.PMA_MODES.NPM;" and get not-premultiplied texture data in "texture2D".

However its possible only with Mesh-shaders and not filters. All results of rendering in the middle are in PMA.

Btw, if you want to just tint everything the same color, you can use pixi-heaven double-tint stuff.

Better to learn how to do your stuff with PMA ;) Also, you can just use tricks like in https://github.com/pixijs/pixi-picture/blob/master/src/ShaderParts.ts#L8 (its my NPM filter blending)

Edited by ivan.popelyshev
Link to post
Share on other sites
8 hours ago, ivan.popelyshev said:

You can specify "texture.baseTexture.pmaMode = PIXI.PMA_MODES.NPM;" and get not-premultiplied texture data in "texture2D".

However its possible only with Mesh-shaders and not filters. All results of rendering in the middle are in PMA.

Btw, if you want to just tint everything the same color, you can use pixi-heaven double-tint stuff.

Better to learn how to do your stuff with PMA ;) Also, you can just use tricks like in https://github.com/pixijs/pixi-picture/blob/master/src/ShaderParts.ts#L8 (its my NPM filter blending)

Ok, thanks. I can almost get what I want with PMA. It's just the blending on the edges that's a bit off. I'm using a texture as a mask for the filter.

Btw, I get the same thing when experimenting on Shadertoy, so I'm guessing it's the way WebGL works.

Link to post
Share on other sites
4 hours ago, ivan.popelyshev said:

It's just the blending on the edges that's a bit off.

I'm using a texture as a mask for the filter.

give me more info, i'm proficient with those kind of issues. I can help with it in weekend if you give me full demo

I've updated the playground example with my exact shader. The undesired effect that happens is the black border on the edges - I think it's not PMA issue, because I changed the texture to have alpha 1.0 for all pixels and I use the other channels. Looks more like a blending issue and I tried playing with the blend mode of the sprite, but that does not seem to affect it.

Link to post
Share on other sites
33 minutes ago, ivan.popelyshev said:

I'm sorry, I dont understand what are you trying to do in this shader :( Can you elaborate please?

vec4(c,c,c,1.0) even if you dont multiply it by red color of texture gives you black on edges, of course. What exactly do you want to do with it?

I want the colour to be the same everywhere, the problem is that if I do :

gl_FragColor = vec4(1.0, 1.0, 1.0, a);

I expect to have transparency where the texture is black, but I don't.

Link to post
Share on other sites

 

3 hours ago, ivan.popelyshev said:

Does that work for you? If not, please describe how should it look

vec4 fc = vec4(c, c, c, c);

Yes, this looks the way I want it to, for white, only I can't seem to make it work this way for different colours.

I tried :

            fc *= vec4(.2, .6, .1, 1.0);

This gives black borders.

            fc *= vec4(.1, .5, .1, 0.5);

No black borders, but the colors are a lot brighter.

Btw, I understand it's not a pixi issue, I get exactly the same on Shadertoy. If I might summarize my question it would be :

Why fragColor = vec4(1.0, 1.0, 1.0, 0.0) outputs white? I think that's the crux of the issue.

Edited by yloquen
Link to post
Share on other sites
2 hours ago, ivan.popelyshev said:

because it should be premultiplied alpha . http://www.adriancourreges.com/blog/2017/05/09/beware-of-transparent-pixels/ Blending function assumes that you already multiplied colors by alpha, so it doesnt multiply it, just adds your result.

Ok, thanks for the help. I found the mistake I was making.

I wasn't clamping the value of "c" so it could be more than 1 and the result of that was that the correct colors look like shadow next to the bright values resulting from the areas with initial value larger than 1.

Here's what I was after. You can comment this:

c = clamp(c, 0.0, 1.0);

to see the difference.

Edited by yloquen
Edit : Wrong link
Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
  • Recently Browsing   0 members

    No registered users viewing this page.

×
×
  • Create New...