December 2013
Beginner
122 pages
2h 43m
English
Raphael is a toolkit for making beautiful things on the Web. With a few lines of code and the help of a small, free JavaScript library, you can turn the browser into a living gallery of interactive artwork and visualization. This book will teach you how to bridge the gulf between the page and your imagination.
Let’s dive straight into a complete working example.
<!DOCTYPE html><html><head><title>Red dot</title></head><body><divid="container"></div><scriptsrc="http://cdnjs.cloudflare.com/ajax/libs/raphael/2.1.0/raphael-min.js"></script><script>varpaper=Raphael("container",500,300);vardot=paper.circle(250,150,100).attr({fill:"#FF0000",stroke:"#000099","stroke-width":3});</script></body></html>
Load this code into any browser—either by hand or on a site like jsFiddle that lets you experiment with code—and with any luck, you will see this:

See this code live on jsFiddle.
If you’re not impressed yet, don’t worry. You’ve actually seen something pretty neat. Let’s go over what we just did:
<div> element with the id container.
Read now
Unlock full access