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

時間 2019-11-24

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

原文原文鏈接

Raphael 是一個用於在網頁中繪製矢量圖形的 Javascript 庫。它使用 SVG W3C 推薦標準和 VML 做爲建立圖形的基礎，你能夠經過 JavaScript 操做 DOM 來輕鬆建立出各類複雜的柱狀圖、餅圖、曲線圖等各類圖表，還能夠繪製任意形狀的圖形，能夠進行圖表或圖像的裁剪和旋轉等複雜操做。Raphaël 是跨瀏覽器的矢量圖形庫，目前支持的瀏覽器包括： Firefox 3.0+，Safari 3.0+，Chrome 5.0+，Opera 9.5+ 以及 Internet Explorer 6.0+ javascript

用法： html

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

// 在座標（10,50）建立寬320，高200的畫布

varpaper = Raphael(10, 50, 320, 200);

// 在座標（x = 50, y = 40）繪製半徑爲 10 的圓

varcircle = paper.circle(50, 40, 10);

// 給繪製的圓圈填充紅色 (#f00)

circle.attr("fill","#f00");

// 設置畫筆（stroke）的顏色爲白色

circle.attr("stroke","#fff");