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>