Raphaël - Vector Graphics JS Library

Raphaël is a lightweight Vector Graphics JavaScript Library using the SVG W3C Recommendation and VML as a base for creating graphics, which can be used to simplify your work with vector graphics on the web.

Raphaël is good for creating amazing effects like image relection, rotation, chart, graph, animation, map and more.

Installation:

# Yarn
$ yarn add raphael

# NPM
$ npm install raphael --save

How to use it:

1. Include Raphaël.js in your page

<script src="raphael.js"></script>

2. Use it as simple as:

// Creates canvas 320 × 200 at 10, 50
var paper = Raphael(10, 50, 320, 200);

// Creates circle at x = 50, y = 40, with radius 10
var circle = paper.circle(50, 40, 10);
// Sets the fill attribute of the circle to red (#f00)
circle.attr("fill", "#f00");

// Sets the stroke attribute of the circle to white
circle.attr("stroke", "#fff");

Changelog:

v2.3.0 (2019-08-14)

• Unminified versions now without sourcemaps
• start script for building all versions

v2.2.8 (2018-03-25)

• Downgraded qunit to v1 to make tests work again
• Updated webpack to build dist
• Updated supportsTouch query from modernizr
• Fix drag offsets passed to "drag.start" from touch drags in elproto.drag
• Fix memory leak in Element.removeData()
• Adding react-raphael to related projects
• Added icons back to raphael's website
• Updated version in banner and raphael's website
• Updated site refs to https

v2.2.7 (2018-03-25)

• Updating package.json dependencies
• Using custom eve instead of old eve in npm
• Fixed class as a reserved word in old browsers

v2.2.2 (2016-07-10)

• Milestone for bug fixes contributed by the community.

---

This awesome jQuery plugin is developed by DmitryBaranovskiy. For more Advanced Usages, please check the demo page or visit the official website.