Animating mixed units

Hello,

I recently faced an unexpecting behavior when I was authoring a SVG document.
I was animating a radius circle to build an iris opening effect.

I was confused because it worked nicely with Firefox 4, poorly with Opera 11 (it was like a discret animation instead of a linear one) and not at all with Chrome 10.

Here is a reduced test case of my problem :

<?xml version="1.0"?>
<svg width="120" height="120"  viewBox="0 0 120 120"
     xmlns="http://www.w3.org/2000/svg" version="1.1">
  
<rect x="0" y="0" width="120" height="120" fill="red" />

<circle r="0" cx="60" cy="60" fill="green">
 <animate attributeType="XML"
    attributeName="r"
    to="100%"
    dur="5s" 
    fill="freeze" />
</circle>
</svg>

My problem is that I try to animate a pixel value to a percentage value.

To me, it's really problematic for two reason :

1. I tried to animate from 0 pixel to 100% and it fails. If I try to animate from 0% (explicitly) to 100%, all browsers work fine. So the question is : What is the f*** difference between 0px and 0% ? This is amazingly confusing for author.

2. There are legitimate use cases to animate a size or a coordinate from an absolute value to a relative value but that means that it should be possible to animate from pixel to percentage. For what I know, this is something unspecified in SVG. Could you enlight me if I'm wrong on that point ? If I'm right, could it be possible to add something about that in the upcoming SVG spec (at worst for SVG 2) ?

I really think that in that case, the way Mozilla handle this is the best way for authors.

Regards
Jérémie
----------------------------------
Web : http://jeremie.patonnier.net
Twitter : @JeremiePat

Received on Thursday, 31 March 2011 10:01:34 UTC