SVG操作插件：SVG.JS 個人提取部分實用中文文檔

先貼出github地址：https://github.com/svgdotjs/svg.js（也就是原文檔的說明和文件的下載地址）

 

創建SVG文檔

var draw = SVG('drawing').size(300, 300) //設置大小,如果是百分比則跟隨父窗體變化,drawing是html的divid
var rect = draw.rect(100, 100).attr({ fill: '#f06' })//draw.rect 畫一個矩形，fill顏色是#06

html元素：

<div id="drawing"></div>

　

 此時已經可以運行,運行生成的html代碼如下：

<div id="drawing">
  <svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="300" height="300">
    <rect width="100" height="100" fill="#f06"></rect>
  </svg>
</div>

 

也可以在生成SVG之前對該當前使用的瀏覽器進行判斷，是否支持SVG

if (SVG.supported) {
//如果支持則生成
  var draw = SVG('drawing')
  var rect = draw.rect(100, 100)
} else {
//不支持則提示
  alert('SVG not supported')
}

創建一個鏈接的SVG，不要忘了draw對象文檔的創建

var link = draw.link('http://svgjs.com')
                var rect = link.rect(100, 100)

此外關於鏈接還有N多個相關操作,可以觀看原文,順便求大神完整漢化一遍

 

..對我來說這些夠用了,希望對大家能有一點幫助