I learned about RaphaelJS recently and used it (along with some jQuery code) to make a very interactive county-by-county map of data our company is interested in displaying for marketing purposes.
I've heard about D3 (http://d3js.org/), but haven't had a chance to use it in my work yet. Can anyone offer comparisons with its SVG rendering performance & capabilities?
D3 just exposes SVG directly to you. But with county maps specifically, you can compress and simplify the data with TopoJSON and use d3.geo to render it. d3.geo even has a canvas renderer and many projections to choose from. And since it's d3, you can do data-driven transitions between different datasets and projections.
I bet you haven't seen anything like this in Raphael.
I used Raphael in the past and am just starting to learn D3 now. D3 seems to make it a lot easier to take a data set and represent it visually. It has lots of very useful helpers for scaling axes and such (even when the units are time). I know I've only really scratched the surface so far, but those are things that stand out the most.
Raphael is still very capable, but it took me a lot more effort to create a graph than with D3. I think Raphael is better at general purpose drawing.
Bottom line: D3 is best if you're taking data and want to represent it visually in a chart/graph. Raphael can do general-purpose drawing without explicitly needing any data to back it.
thanks this is very useful. i made this little video tutorial http://captico.com/animation-with-raphaeljs/2010/07 showing how to take an illustrator exported svg and animate the paths... i think having your rappar will make the whole process of building animations much easier... thanks!
Why do you put the two dots over the 'e'? Don't you know that this is the kind of unnecessary flooflaw that breaks things?
A few years ago I downloaded a tarball of Java source code from somewhere. The author's name in a comment had a vowel with two dots over it, and that was the only non-ASCII character in the files. I could not get those files to compile at all! I was using official JDK and everything. Finally I did a mass search-and-replace to get rid of the funny character and they compiled fine.
Non-ASCII characters in filenames are just as bad as spaces. Why, back in my day, we got by with eight and three! And we didn't even have directories until DOS 2.0! Now get off my lawn.
While we're talking about this, does anyone know what might be causing this slowdown that my buddy is running in to when using Raphael to run an infinitely repeating animation?
This is sort of off topic so apologies in advance. I am a data scientist who wants to get into designing visualizations on the web. Is there a 101 of where to start? I have not done much on the lines of web development so I don't really know if spending a few months learning say Javascript is what I should do?
I really, really like Raphael. I was in a position to try out Easel, Fabric and Raphael and while is was my personal favorite, our needs to stay close to AS3 (to port flash) meant we went with Easel.
I totally second this. The learning curve for Raphael is so much less steep than D3 and there's some really nice functionality built into the framework. The only (small) qualm I have is that it's a relatively bulky package, but you definitely can cut out pieces that you don't use that are unnecessary.
Third'ed. After a careful study of the available cross-browser svg libraries a year and a half ago, I selected Raphael for a series of WebApps. Some associates chose others. Over time, they now all use Raphael. One of those decisions where I look back and think "got it right the first time!"
[+] [-] brechin|13 years ago|reply
I've heard about D3 (http://d3js.org/), but haven't had a chance to use it in my work yet. Can anyone offer comparisons with its SVG rendering performance & capabilities?
[+] [-] oscilloscope|13 years ago|reply
I bet you haven't seen anything like this in Raphael.
http://www.jasondavies.com/maps/transition/
[+] [-] erikdared|13 years ago|reply
Raphael is still very capable, but it took me a lot more effort to create a graph than with D3. I think Raphael is better at general purpose drawing.
Bottom line: D3 is best if you're taking data and want to represent it visually in a chart/graph. Raphael can do general-purpose drawing without explicitly needing any data to back it.
[+] [-] talabes|13 years ago|reply
Perhaps its also useful. Enjoy!
[+] [-] taf2|13 years ago|reply
[+] [-] csense|13 years ago|reply
A few years ago I downloaded a tarball of Java source code from somewhere. The author's name in a comment had a vowel with two dots over it, and that was the only non-ASCII character in the files. I could not get those files to compile at all! I was using official JDK and everything. Finally I did a mass search-and-replace to get rid of the funny character and they compiled fine.
Non-ASCII characters in filenames are just as bad as spaces. Why, back in my day, we got by with eight and three! And we didn't even have directories until DOS 2.0! Now get off my lawn.
[+] [-] simoncion|13 years ago|reply
Details are at this stackoverflow question: http://stackoverflow.com/questions/15098456/raphael-gradual-...
[+] [-] eshvk|13 years ago|reply
[+] [-] talabes|13 years ago|reply
If web development is what you want, javascript is a must.
[+] [-] purephase|13 years ago|reply
Raphael is a very nice library though.
[+] [-] aviswanathan|13 years ago|reply
[+] [-] bsenftner|13 years ago|reply
[+] [-] lispilicious|13 years ago|reply
AFAICT there is no jQuery dependency, or am I mistaken?
[+] [-] sosuke|13 years ago|reply
[+] [-] Cigano|13 years ago|reply
Can someone confirm that?
[+] [-] AlexeyBrin|13 years ago|reply
If you reenable JS in your browser you should be able to see the content of the page.
[+] [-] talabes|13 years ago|reply