Raphael 是一個用於在網頁中繪制矢量圖形的 Javascript 庫。它使用 SVG W3C 推薦標准和 VML 作為創建圖形的基礎，你可以通過 JavaScript 操作 DOM 來輕松創建出各種復雜的柱狀圖、餅圖、曲線圖等各種圖表，還可以繪制任意形狀的圖形，可以進行圖表或圖像的裁剪和旋轉等復雜操作。
您可能感興趣的相關文章
- 經典的白富美型 jQuery 圖片輪播插件
- 2012年最佳 Web 前端開發工具和框架
- 讓人愛不釋手的13套精美網頁圖標素材
- 10套精美的免費網站后台管理系統模板
- 精心挑選的優秀 jQuery Ajax 分頁插件
Raphaël 是跨瀏覽器的矢量圖形庫，目前支持的瀏覽器包括： Firefox 3.0+，Safari 3.0+，Chrome 5.0+，Opera 9.5+ 以及 Internet Explorer 6.0+。
如何使用？
在頁面中引入 raphael.js 文件，然后就可以繪制任意的矢量圖形了：
// 在坐標（10,50）創建寬320，高200的畫布
var paper = Raphael(10, 50, 320, 200);
// 在坐標（x = 50, y = 40）繪制半徑為 10 的圓
var circle = paper.circle(50, 40, 10);
// 給繪制的圓圈填充紅色 (#f00)
circle.attr("fill", "#f00");
// 設置畫筆（stroke）的顏色為白色
circle.attr("stroke", "#fff");
精彩示例：
- Raphaël Playground
- Reflection
- Image rotation
- Text rotation
- GitHub-a-like impact chart
- GitHub-a-like punch chart
- GitHub-a-like languages chart
- Raphaël Analytics chart
- Polar Clock
- Dynamic Spinner
- Australian Map
- Dancing Helvetica
- Multichart
- Animation
- Tiger
- Hand
- Interactive Chart
- Diagram
- Custom Fonts
- Animation Easing
- Gradients Example
- Curver
- Animation along the path demo
- 3D Shooter
- Colour Picker
- Growing Pie
- Bounce
- World Map
實用網站：
Raphael 官方網站地址：http://raphaeljs.com
Raphael 英文參考文檔：http://raphaeljs.com/reference.html
Raphael 中文幫助文檔：http://julying.com/lab/raphael-js/docs/
教程推薦：
Raphael 簡介：HTML5 Rocks：Introduction to Raphaël.js
Raphael 新手入門教程：An Introduction to the Raphael JS Library
Raphael 繪制柱狀圖表：Creating a chart with raphael.js
您可能感興趣的相關文章