先贴出 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 多个相关操作, 可以观看原文, 顺便求大神完整汉化一遍
.. 对我来说这些够用了, 希望对大家能有一点帮助
来源: http://www.cnblogs.com/ncellit/p/6136636.html