Use Raphael to Draw (a) basic graphics (JavaScript)

What is Raphael?

Raphael is a Javascript library for drawing vector graphics in Web pages. It uses the SVG recommendation Standard and VML as the basis for creating graphics, you can easily create a variety of complex bars, pie charts, graphs and other diagrams through JavaScript operation DOM, you can also draw any shape of the graph, can be a chart or image cropping and rotation and other complex operations.

Raphaël is a cross-browser vector graphics library that currently supports browsers including: Firefox 3.0+,safari 3.0+,chrome 5.0+,opera 9.5+ and Internet Explorer 6.0+.

How to use Raphael:

By introducing the Raphael.js file in the page, you can then draw any vector graphics:

To start creating a view area:

var paper = Raphael ("mydiv", 580, 600); // Create a View  area

<id= "mydiv"></div>

Next, you can draw a graphic.

1, Draw the circle:

var c = paper.circle (50, 89, 40); // Draw a circle (X,y,r), R represents the radius  of the circle

2, Draw the rectangle:

var r = Paper.rect (100, 19, 80, 50,10); // Draw Rectangle (x,y,width,height,r), R for rectangle fillet, default to 0

3, Draw ellipse:

var e = paper.ellipse (50, 159, 40, 20); //

4, picture

var i = paper.image ("Heffalump.png", 200, 19, 80, 80); //

5,text:

var t = paper.text (where\n amazing\n happens! "); // text  

6, Path:

var p = Paper.path ("M10 10L 110 100"); //

7,set: Several graphs are merged together to facilitate unified management, as I understand.

var st = Paper.set (); // Set        St.push (           paper.circle (),           paper.circle(310, ())  ;  

Raphael Download

Http://files.cnblogs.com/kt520/DmitryBaranovskiy-raphael-v2.0.1-2-g2b0c5a2.zip

Use Raphael to Draw (a) basic graphics (JavaScript)