创建一个画布对象。
下面每个例子都会创建一个320*200大小的画布。
|
1
2 |
// 1.在视口的 (10,50) 坐标位置上创建画布var paper = Raphael(10, 50, 320, 200); |
|
1
2 |
// 2.在#element_id元素的原点位置创建画布var paper = Raphael(document.getElementById("element_id"), 320, 200); |
|
1
2 |
// 3.同上var paper = Raphael("element_id", 320, 200); |
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14 |
// 4.导出图片var set = Raphael(["element_id", 320, 200, { type: "rect", x: 10, y: 10, width: 25, height: 25, stroke: "#f00"}, { type: "text", x: 30, y: 40, text: "Dump"}]); |
|
1
2 |
// 标准矩形 var c = paper.rect(10, 10, 50, 50); |
|
1
2 |
// 圆角矩形var c = paper.rect(40, 40, 50, 50, 10); |
绘制箭头的例子见改变属性
|
1
2
3 |
// 绘制直线// 移动到(10,10)，绘制直线到(90,90)var c = paper.path("M10 10L90 90"); |
|
1
2 |
// 绘制2次贝赛尔曲线var c = paper.path("M20,120 Q100,10 180,90"); |
|
1
2 |
// 绘制2次贝赛尔曲线，平滑连接var c = paper.path("M20,120 Q100,10 180,90 T280,70"); |
|
1
2 |
// 绘制3次贝赛尔曲线var c = paper.path("M20,20 C50,80 150,160 180,40"); |
|
1
2 |
// 绘制3次贝赛尔曲线，平滑连接var c = paper.path("M20,20 C50,80 150,160 180,40 S320,200 100,190"); |
|
1 |
var c = paper.image("apple.png", 10, 10, 80, 80); |
原文：http://www.cnblogs.com/stephenykk/p/3563995.html