Tuesday, August 31st, 2010

Raphaël 1.5 Released

Category: Announcements, Framework, SVG

Dmitry Baranovskiy and team have released another version of Raphaël, an excellent drawing and animation library backed by SVG (VML on Internet Explorer). New features in Raphaël 1.5 include custom attributes and keyframes. Keyframes can be defined similar to CSS3 Animations:


  1. el.animate({
  2.     "20%": {cy: 200, easing: ">"},
  3.     "40%": {cy: 100},
  4.     "60%": {cy: 200},
  5.     "80%": {cy: 300, callback: function () {}},
  6.     "100%": {cy: 200}
  7. }, 5000);

Check out a demo of the new keyframe animation.

Custom attributes is also a new feature that makes it easier to do things like animating a portion of an attribute segment (demo).

Full release notes:

  • fixed IE8 issue with the HTML element named Raphael
  • fixed precision for arcs in IE
  • added caching to getPointAtSegmentLength function
  • added ability to do more than one animation of an element at the same time
  • added “cubic-bezier()” as an easing method
  • added new syntax for animation (keyframes)
  • hsl2rgb now accept h as degree (0..360), s and b as % (0..100)
  • show=”new” instead of target=”blank” for SVG
  • added angle method
  • added snapTo method
  • cached popup || activeX for IE
  • fixed insertAfter
  • fixed timeouts for animation
  • added customAttributes

BTW I just noticed that Dmitry is now at Sencha; they’re assembling quite the team! Congrats Dmitry!

Posted by Brad Neuberg at 5:30 am

3 rating from 22 votes


Comments feed TrackBack URI

Thank you Brad.
Just FYI there no team, just me. :)

Comment by DmitryBaranovskiy — August 31, 2010


Looks very awesome =).

Is there going to be a corresponding update to gRaphael in the works?

You know what would be the most awesome thing? If somebody could demo Google’s Flash-based Annotated Time Line (http://code.google.com/apis/visualization/documentation/gallery/annotatedtimeline.html) in gRapahel…lol. *hint hint*.


Comment by victorhooi — August 31, 2010

Raphael has been really undervalued for long, with many confusing it with the general HTML5 buzz. It is really a fantastically designed cross browser JS library!

It forms the basis for the Chittram – Online Vector (SVG) Editor that I developed.


Comment by Chittram — September 1, 2010

Leave a comment

You must be logged in to post a comment.