The developer’s toolkit: raphael.js

Hey, folks. Luc here, coming at you to talk about a pretty, pretty sweet JS library. JavaScript occasionally gets a bad rap as a programming language, but its usefulness if not indispensability for web developers of all stripes is difficult to deny. Yet another case in point: raphael.js. This is a tool that lets you not only paint with JavaScript, but also to make interactive objects like this.

Now, raphael.js seems like something that many of us could live without. But it also strikes me as perfect if you’re working on a project that needs just a tiny bit of extra aesthetic pizzazz beyond what’s available in CSS, jQuery,et al. Even better, it’s an absolute breeze if you feel even remotely comfortable in JavaScript. To give one very basic example: you can use just one instance of JavaScript’s “for” function (typically used for iteration) to produce 30 circles with circumferences varying according to an equation (for example, making concentric circles separated by 5 pixels). The following code will get you 30 such circles emanating out from the center of a 500×500 pixel canvas:

for ( i = 0; i < 30; i++) {
var x = 0;
var circle = ( 250, 250, 0+5x );
};

That’s it. Four lines. But this tool isn’t just about pizzazz. Things like this strike me as downright useful. And there are plenty of tutorials like this one to help ease you into using it and expand your capabilities.

Though I haven’t yet delved too deeply into JavaScript’s many uses (as I’ve been focusing on Ruby), I’ve been impressed by its versatility. In the coming weeks, I’ll be talking about other .js libraries as I discover them. Recommendations welcome!

Share this post

Try AppFog: The new PaaS Hackers love