Re: [filters] transform and composite-under/over

In the context of SVG: would you introduce a new effect for transforms or make effects transformable (where the transforms can get animated as well)? Tab Atkins noted the clipping: Should the effect region be dependent of a transform? Should we modify the effect region automatically if the necessary size increases after a transform, except the case where the author sets the clipping region himself?

Dirk
 

> On Tue, Sep 6, 2011 at 6:06 PM, Dean Jackson <dino@apple.com> wrote:
>> I think it would be useful to add the following shorthand functions to the filter property.
>> 
>> 'transform(<transform value>)' applies a 2d affine transformation effect. A common example here is that you want to scale the filtered image a little, so that appears slightly bigger than the source. Imagine a piece of h1 text as input, apply some effect like a blur, increase the scale and draw it behind the original.
> 
> Sounds excellent!  I assume this has no geometric effect, as normal
> for transforms, so rotating an image with the filter() function would
> end up clipping the corners that are now outside the image's geometry.
> 
> Why not expose the transform functions directly, rather than requiring
> them to be wrapped in a transform() function?  That is, allow "filter:
> scale(1.1);" rather than "filter: transform(scale(1.1));"
> 
> 
>> The only transformation effect SVG 1.x provides is feOffset, which is a generalised case of what I'm proposing.
>> 
>> The effect makes more sense in the context of the next proposals.
>> 
>> 'composite-under' and 'composite-over' allow the author to blend the current filter image with the source graphic. For effects on non-image content, you're often going to want to blend with the unfiltered source. In the example above, you want to keep the original text visible and still apply an effect. You don't want to duplicate the element.
>> 
>> (I'm not fond of the lengthy names… maybe 'under' and 'over' are enough)
>> 
>> For example, 'composite-under' would be equivalent to:
>> 
>> <filter id="composite-under">
>>  <feMerge>
>>    <feMergeNode/>
>>    <feMergeNode in="SourceGraphic"/>
>>  </feMerge>
>> </filter>
>> 
>> (you can also do it with feComposite)
> 
> Sounds good as well.  The example you gave is compelling:
> 
> h1 {
>  filter: blur(5px) transform(scale(1.1)) under();
> }
> 
> I can't tell if I want over/under to have the meanings you give here,
> or if I want to swap them.  I suspect either would make equal sense.
> 
> (How far are we going down this route?  Are we stopping at "you can
> refer to the source graphic", or would we eventually get the ability
> to tag subsets of the filter chain and refer to them?  I suspect the
> latter is best left in real SVG; representing graphs in nested
> functions is nasty.)
> 
>> I'm wary of introducing more work, so I should suggest that another way to achieve the effect of 'under' would be to use the filter() function on a background-image. It's a little roundabout, but might do for most things. On the other hand, these functions are very easy to implement.
> 
> If I'm understanding you correctly, you're referring to doing
> "background-image: filter(...);", where the filter() function refers
> to the element itself (maybe through the element() function?).  That
> seems hackier than necessary.  If this is a good use-case we should
> address it directly.
> 
> ~TJ
>

Received on Wednesday, 7 September 2011 07:11:55 UTC