強大的矢量圖形庫：Raphael JS 中文幫助文檔及教程

時間 2019-11-09

標籤強大矢量圖形 raphael 中文幫助文檔教程欄目 JavaScript 简体版

原文原文鏈接

轉自：http://www.cnblogs.com/lhb25/javascript

Raphael 是一個用於在網頁中繪製矢量圖形的 Javascript 庫。它使用 SVG W3C 推薦標準和 VML 做爲建立圖形的基礎，你能夠經過 JavaScript 操做 DOM 來輕鬆建立出各類複雜的柱狀圖、餅圖、曲線圖等各類圖表，還能夠繪製任意形狀的圖形，能夠進行圖表或圖像的裁剪和旋轉等複雜操做。html

　　Raphael 是跨瀏覽器的矢量圖形庫，目前支持的瀏覽器包括： Firefox 3.0+，Safari 3.0+，Chrome 5.0+，Opera 9.5+ 以及 Internet Explorer 6.0+。html5

　　如何使用？

　　在頁面中引入 raphael.js 文件，而後就能夠繪製任意的矢量圖形了：java

 
         // 在座標（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" 
         );