State of SVG animation in Firefox and Chrome (Webkit) ?

[Cyril Hansen]

Hi !

I have been experiencing with SVG animation with lib-gwt-svg. I read
in this forum that only Opera supported them fully.

I use Chrome under Linux for GWT dev mode, and my results were what I
could expect : the animation worked under opera, but neither in Chrome
or Firefox, be it in dev mode or production mode.

I tried it again this morning, correcting some setup code, and I
noticed that, while the animation still does not work in chrome in dev
mode, it does in production mode.

My test consist only of a simple animate element targeted on a width
attribute, it is very simple. The browser behavior is still
different :

Chrome starts the animation only if beginElement is called, but Opera
and Firefox starts it immediately.


My objective is to use an SVG animation to implement a smooth zooming
animation like the one from the projects Prezi (http://prezi.com/) or
Sozi (http://sozi.baierouge.fr/wiki/en:welcome).

Do you think it is doable in a GWT project targeting at least Chrome
and Firefox ? It would piss me off to have to use flash to implement
this..


Regards,

Cyril

[Lukas Laag]

Hi Cyril,

From my point of view, SMIL animation works correctly in lib-gwt-svg in
Opera and FF (though FF has only partial support as of today, lacking
animateColor).

With the latest Chrome, the situation is not very satisfactory. I am
able to get SMIL animations to work partially in JavaScript (with
partially meaning that the animation events are not fired as they should
be). I have not been able to get SMIL animation to work in Chrome with
lib-gwt-svg so far. There is a bug some place which I have been unable
to fix. The methods are indeed called and do not raise an error, I can
see with the embedded development tools that the proper JavaScript types
are instantiated, but nothing moves. If someone has an idea, I would be
really grateful. I wonder if this caused by the GWT code living in an
IFrame, or by some other weird Chrome bug ?

In IE, there is no SMIL animation support so far.

To answer your question, I think SMIL animation is not mature enough yet
to support something like http://prezi.com/. One reason is the lack of
availability on some platforms (Chrome, IE). Another one is that the
resulting animations do not look as smooth as what is done in Flash. If
you want to do it today in SVG in reliable way, I think you will be
better off interpolating the coordinates yourself and scheduling repaint
with requestAnimationFrame.

Regards

Lukas

[Cyril Hansen]

Thank you for this information, I will look at manually scheduled
animations then.

Regarding the Chrome behavior, there is a bunch of bugs filled in
WebKit's and Chromium bugtracker.

https://bugs.webkit.org/buglist.cgi?quicksearch=beginElement
http://code.google.com/p/chromium/issues/list?q=beginElement

especially :
http://code.google.com/p/chromium/issues/detail?id=89308

Maybe if everybody in this list "stars" the open ones that will help
speed up the fixes...


Regards,

Cyril

> to support something likehttp://prezi.com/. One reason is the lack of

[Francois-Xavier KOWALSKI]

Good idea. I just starred this issue. Supporting SMIL type of animation paves the way to hardware acceleration of moving SVGs... BTW, is there any other way to help platform providers to hw-accelerate this?

--FiX

[Robert Longson]

On Tuesday, 24 January 2012 21:10:22 UTC, Lukas Laag wrote:

From my point of view, SMIL animation works correctly in lib-gwt-svg in

Opera and FF (though FF has only partial support as of today, lacking
animateColor).

That's full support then as you can replace animateColor by animate and have it work.
That's why animateColor is deprecated in the SVG specification.

Robert.