W3C home > Mailing lists > Public > public-fx@w3.org > January to March 2010

Some thoughts on css transforms in svg

From: Erik Dahlstrom <ed@opera.com>
Date: Thu, 11 Mar 2010 19:48:12 +0100
To: "public-fx@w3.org" <public-fx@w3.org>
Cc: www-svg <www-svg@w3.org>
Message-ID: <op.u9e2ijmvgeuyw5@erik-dahlstroms-macbook-pro-2.local>
Hi,

just trying to gather some of my thoughts on css transforms in svg.

- 'transform' in svg is defined to be an attribute, not a property
- transform animation using animateTransform (defined in SVG) affects the  
transform attribute currently
- there's nothing like the transform-ref[1] in css2d transforms, how  
should that be mapped?

Here are some possible ways of adding support for css transforms in svg:

1. Treat it as any of the other CSS properties that SVG share with  
HTML/CSS (e.g 'display'), basically same as overriding the attribute
Advantage(s): mostly consistent with the model (possibly with the  
exception of 'none')
Notes: What 'transform: none' means in css2d transforms isn't clearly  
defined, for svg it would have to mean that the attribute is used,  
otherwise backwards compatibility is lost. Should there be an 'auto'  
initial value to deal with these cases?

2. Treat it such that it applies the css transform by postmultiplying it  
to the transform attribute before presentation.
Advantage(s): no need to duplicate transforms on a case-by-case basis in  
css that are already in the markup when something needs to be tweaked.  
Easily fits into the model. Preserves backwards compatibility.
Disadvantage(s): Not possible to ignore a transform attribute by using  
css. Slightly different from the model used for other props in svg.

3. Treat it such that if it's not 'none' it applies the css transform by  
postmultiplying it to the transform attribute before presentation.
Advantage(s): possible to override transform attribute with 'none'  
keyword. preserves backwards compat.
Disadvantage(s): you might want to ignore attribute and then add some  
transform in css. inconsistent with model (where css props override  
attributes).

Thoughts?


[1] http://www.w3.org/TR/SVGTiny12/coords.html#transform-ref

-- 
Erik Dahlstrom, Core Technology Developer, Opera Software
Co-Chair, W3C SVG Working Group
Personal blog: http://my.opera.com/macdev_ed
Received on Thursday, 11 March 2010 18:48:48 GMT

This archive was generated by hypermail 2.2.0+W3C-0.50 : Thursday, 11 March 2010 18:48:48 GMT