Re: [css3-images] cross-fade()

On Friday 2011-05-06 12:47 +1000, Alex Danilo wrote:
> Hi Fantasai & All,
> 
> --Original Message--:
> >On 05/04/2011 02:43 PM, Rik Cabanier wrote:
> >>  David Baron wrote:
> >>> I think the current definition of cross-fade() in
> >>> http://dev.w3.org/csswg/css3-images/#cross-fade-function is
> >>> incorrect.  It defines cross-fade() in terms of the porter-duff over
> >>> operator, which is not symmetric.  This means that cross-fade(A, B,
> >>> 30%) is different from cross-fade(B, A, 70%).

The version we're discussing is:
http://dev.w3.org/cvsweb/~checkout~/csswg/css3-images/Overview.html?rev=1.81;content-type=text%2Fhtml#cross-fade-function

> This is not correct, they are the same.
> 
> A * (1 - 0.3) + B * 0.3 == B * (1 - 0.7) + A * 0.7

No, the formulation with over, for cross-fade(A, B, p) is:
  C_R = (1-p) * C_A + p * C_B * (1 - (α_A * (1-p)))
since over multiplies the image underneath by 1 minus the alpha of
the image on top.  Plus does not, so with with plus it's just:
  C_R = (1-p) * C_A + p + C_B

(I'm using C_R, C_A, C_B for the value for a given pixel of each
color component of the result, image A, or image B, and α_A for the
alpha component of image A.)

-David



> 
> >>> I *think*, though I'm not sure, that the right way to define
> >>> cross-fade is in terms of the plus operator described in section 4.5
> >>> of the original Porter-Duff paper:
> >>> http://keithp.com/~keithp/porterduff/
> >>
> >> I *think* you're right.
> >>
> >> It should read either:
> >>
> >>   Then, the start image has a global alpha applied to it equal to
> >>   (1-p), the end image has a global alpha applied to it equal to p,
> >>   and the end image is then composited over the start image with
> >>   the plus operation
> >>
> >> or
> >>
> >>   Then, the end image has a global alpha applied to it equal to p,
> >>   and the end image is then composited over the start image
> >>   with the source-over operation
> >>
> >> but I could be wrong...
> >
> >Ok, I've updated the spec with s/source-over/plus/ per dbaron's instructions.
> >But as I'm not a graphics person /at all/, I would like someone to confirm
> >whether the resulting is correct. :)
> >   http://dev.w3.org/csswg/css3-images/#cross-fade-function
> 
> I don't think you want 'plus' here.
> 
> If you are using the alpha, src-over is just an addition - do
> not confuse it with the 'plus' operator which adds the
> unpremultiplied colors, then clamps them to avoid overflow.
> 
> What the function seems to be doing is just a src-over. If 'p'
> is 30% you'll get 30% of one image, and 70% of the other. (1 - p).
> Those would normally be composited with src-over which is plain
> old alpha compositing.
> 
> 'Plus' is used for a different kind of cross-fade as used in
> movies. The two images are combined in such a way that values
> exceed '1'. So, clipping of maximum values must be applied. The
> effect of 'plus' is the second image appearing to take over the
> old one - without any fade of the old one, then you kind of
> reduce the old one by dropping it's alpha down. Hard to explain
> in English.
> 
> Anyway, I doubt it would make any sense to expect web browser
> makers and anyone using existing graphics libraries to add
> P-D 'plus' just for image transitions.
> 
> Alex
> 
> >~fantasai
> >
> >
> 

-- 
L. David Baron                                 http://dbaron.org/
Mozilla Corporation                       http://www.mozilla.com/

Received on Friday, 6 May 2011 03:30:31 UTC