Element.toDefs()
把元素移动到
<defs>
元素可以在SVG图像中重复使用的图形。例如,你可以将多个图形作为一组同时使用。有哪些元素可以放置在
元素中呢?:
- 任何图形元素(rect, line 等.)
- g
- symbol
参数
元素。克隆的元素。
使用
<svg id="svg" width="100" height="100"></svg>
var s = Snap();
var c1 = s.circle(50,50, 50).attr('id','c1').toDefs(); // in <defs>
var cc = s.append( c1.use() );
var cc2 = s.append( c1.use().attr({x:130}) );
生成HTML
<svg height="100%" version="1.1" width="100%" xmlns="http://www.w3.org/2000/svg">
<desc>Created with Snap</desc>
<defs>
<circle cx="50" cy="50" id="c1" r="50"></circle>
</defs>
<use xlink:href="#c1" xmlns:xlink="http://www.w3.org/1999/xlink"></use>
<use x="130" xlink:href="#c1" xmlns:xlink="http://www.w3.org/1999/xlink"></use>
</svg>