Raphaël - JavaScript library for scalable vector graphics

Raphaël is a simple-to-use cross-browser JavaScript library that simplifies work with vector graphics for the websites.

Raphael jsRaphaël is rather small cross-browser JavaScript library that aims at making work with vector graphics on the web easier. Building of specific chart or image cropping and rotating widget is simplified by usage of this library. Vector graphics is based on mathematical equations and has several advantages over raster images:

  • Size. Images in the vector format have smaller size than other format, e.g. raster graphics.
  • Scalability. While enlarging of raster image means only changing the size of the squares of which image consists and leads to the blurred picture, enlarging of the vector image means adapting to the new size by re-computing the equation without the loss in image quality.
  • Editing. Vector image contains set of lines that are independent and distinct objects and can be changed at any time by re-editing the drawing file.

Mathematical equations can generate any geometric shape via vector graphics, including lines, circles, curves, etc. Raphaël relies on the SVG (Scalable Vector Graphics, a XML-based language for describing objects and scenes) W3C Recommendation and VML (Vector Modeling Language) for creating graphics. This is one of the most distinctive features of this library, since in this way every object created with Raphaël is also a DOM object. JavaScript event handlers can be attached to this object or it can be modified later via the DOM.
The main objective of Raphaël is to provide an adapter that can make vector graphics compatible with different browsers. If there is a need of previous browsers versions support, then Raphaël is perfect choice. It handles the following browser versions: Internet Explorer 6.0+ (VML is used for old versions), Firefox 3.0+, Chrome 5.0+, Opera 9.5+, and Safari 3.0+.
Raphaël is a popular tool for creating maps. This library makes it easy to draw counties and has a useful set of functions for interacting with shapes once they’ve been drawn. Raphael renders images as SVGs for modern browsers and as VMLs for Internet Explorer. Moreover, if map is already partially written in SVG format, it can easily be converted into more compact Raphael format, transferring paths data at the same time. Maps can be easily scaled to the desired size.
Raphaël vector images are interactive and can respond to clicking, dragging, and touch. Raphaël currently is one of the leading libraries for drawing on the web, works perfectly with HTML5 and has wide browser support. You can get more information and demos that will show the work of this simple-to-use JavaScript library on Raphaël’s official website.

Connect with our experts Let's talk