Raphael vs Fabric.js

Because Raphael supports rendering VML + SVG, it is one of the few drawing libraries that is backwards compatible with older browsers that do not support canvas.

Several built-in animations (such as ways of easing) are provided for you out of the box, but Raphael also allows cubic beziers for more complicated easing functions. Any drawing object property can be modified making it similar to css animations in jQuery.

Everything that is drawn in Raphael is an object which means it is easy to manipulate any part of the rendered image after it is processed. It uses an event handler system for user inputs which makes it easy to learn for JavaScript developers used to event based libraries.

An interactive chart demo.

This style of handling objects makes Raphael a good fit for rendering interactive diagrams and charts that can also interact with other parts of the page.

gRaphael is a Raphael extension to help you easily create graphs and charts.

Fabric supports node.js, and has an npm package available for server side rendering with all the dependencies handled for you. This allows you to provide graceful degradation for image fallbacks to canvas or SVG content.

Drawing objects in fabric are vector focused, so everything is easily transformable. It makes it easy to create complex pathed shapes, add gradients, or filters. Although fabric is great for vector rendering, it also has image support as well.

When it comes to format compatibility, Fabric is the best, with the ability to output to Canvas, SVG, and JSON. SVG provides backwards compatibility for older browsers, and JSON allows you to store rendered output for later use.

If you are about to customize the library to your needs, this is the project of choice! Great programming work!

Allows creating multi-line text that can even be interactively edited by user interaction.

If the node-canvas dependency is a problem you can now look for npm install fabric@x.y.z-browser