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多个相关操作,可以观看原文,顺便求大神完整汉化一遍

 

..对我来说这些够用了,希望对大家能有一点帮助




posted @ 2016-12-06 10:42  君宁天下  阅读(5087)  评论(0编辑  收藏  举报
野生程序员真的是太难了,一刻也不敢停止学习