Animation in SVG

Dear All,

I am getting totally confused by this discussion as to what is happening to
SVG animation functionality in terms of moving things to CSS.



This is the simplest animation I can think of:



<svg   xmlns="http://www.w3.org/2000/svg"   width="400" height="400">

<path style="stroke:red;fill:none" d="M50,150 c50,100,150,-100,200,0">

<animate attributeName="d"

values="M50,150 c50,100,150,-100,200,0;M80,150 c50,200,100,-200,200,0"
begin="1s" dur="2s" fill="freeze"/>

</path>

</svg>



Having looked at all the CSS stuff about transforms and transitions I still
can't figure out how I will do that in CSS. Can you tell me what it will
look like in the future once the animation functionality moves to CSS?


In most of my animations, the animation of d attributes is close to 96% of
all animation commands.  Which is approximately 100 per sec so over, say, a
6 minute animation something like we are looking maybe 30,000 of these.


Bob

Received on Wednesday, 20 May 2015 18:21:41 UTC