D3.js
D3.js is a JavaScript library for creating interactive data-bound visualisations of documents using HTML, SVG, and Canvas.
Raphael
Raphaël is a cross platform JavaScript library for outputting vector graphics in both standards compliant SVG (for Firefox, Chrome, Internet Explorer 9+ ...) and VML for older versions of Internet Explorer.
Graphic libraries powerful
| Example |
|---|
|
"Raphael will help you draw elements;d3.js is more comprehensive and will help you bind data to elements;so i d say d3.js is more powerful" from question D3.js vs Raphael.js |
|
"The two vector graphic libraries you can focus are raphael and d3.js but d3.js is much more powerful with data binding" from question Javascripts for an Interactive network visualisation |
Older browsers brother
| Example |
|---|
|
"This should be possible maybe be aware snap.svg isn t so compatible with older browsers in which case you could look at raphael which is snaps older brother d3.js is very well established as well" from question Using snap svg for manipulating/dragging/hide/show nodes in SVG diagrams |
|
"Raphael supports older versions of ie whereas d3.js is based on current web standards" from question Any visualization library which does not require user interaction |
Others
| Example |
|---|
|
As it stands d3.js is not just better than raphael and processing in many cases but is also a viable replacement for jquery underscore.js and other frameworks from question D3.js vs Raphael.js |
|
The only place where raphael defeats d3.js is fallback raphael supports older versions of ie where as d3.js is based on current web standards ie 9 from question Visualizing Charts Tutorial |
|
You may order the svg elements such that the circles will be rendered first the lines with arrows thereafter in d3.js there is a .order method see here for details;for the record the corrsponding part of the raphael api is discussed here from question Linking nodes of variable radius with arrows |
|
I don t know why but d3.js is more efficient when animating a large number of elements at once;you can make them both work seamlessly by creating a raphael function that receives a set and returns the html objects you want to animate from question Smoothly animate attribute changes to ~3000 Raphael objects at once |
|
D3.js is much harder to learn than raphael but in both cases you will also have to learn svg to be able to create better animations from question D3.js vs Raphael.js |
|
N the other hand normally d3.js visualizations need less mathematics than the similar processing or raphael examples because there are many prepackaged layouts already;i would say normally d3.js is the better choice for an obvious reason d3.js is based on the current web standards stack html dom - even if you hate normally d3.js you need to use normally d3.js css svg even canvas and is a library for working with data from question D3.js vs Raphael.js |