克隆svg对象（行）

我已经创建了一个基本的安装在pcb上的变压器的svg文件。有没有更好的方法来创建绕组，而不是像下面这样有很多线：

<g id="primarywinding">
        <line id="winding0" style="fill:none;stroke:black;stroke-width:2" x1="60" y1="67" x2="350" y2="67" />
        <use xlink:href="#winding0" transform="translate(0, 4)"/>
        <use xlink:href="#winding0" transform="translate(0, 8)"/>
        <use xlink:href="#winding0" transform="translate(0, 12)"/>
        <use xlink:href="#winding0" transform="translate(0, 16)"/>
        <use xlink:href="#winding0" transform="translate(0, 20)"/>
        <use xlink:href="#winding0" transform="translate(0, 24)"/>
        <use xlink:href="#winding0" transform="translate(0, 28)"/>
        <use xlink:href="#winding0" transform="translate(0, 32)"/>
        <use xlink:href="#winding0" transform="translate(0, 36)"/>
        <use xlink:href="#winding0" transform="translate(0, 40)"/>
        <use xlink:href="#winding0" transform="translate(0, 44)"/>
        <use xlink:href="#winding0" transform="translate(0, 48)"/>
        <use xlink:href="#winding0" transform="translate(0, 52)"/>
        <use xlink:href="#winding0" transform="translate(0, 56)"/>
        <use xlink:href="#winding0" transform="translate(0, 60)"/>
        <use xlink:href="#winding0" transform="translate(0, 64)"/>
        <use xlink:href="#winding0" transform="translate(0, 68)"/>
        <use xlink:href="#winding0" transform="translate(0, 72)"/>
        <use xlink:href="#winding0" transform="translate(0, 76)"/>
        <use xlink:href="#winding0" transform="translate(0, 80)"/>
        <use xlink:href="#winding0" transform="translate(0, 84)"/>
        <use xlink:href="#winding0" transform="translate(0, 88)"/>
        <use xlink:href="#winding0" transform="translate(0, 92)"/>
        <use xlink:href="#winding0" transform="translate(0, 96)"/>
</g>

---

是的，只需重复

标记，而不用use。您可以在进行转换时使用变换，也可以直接调整坐标。至少在Firefox上会快得多。您可以对填充、笔划等使用CSS样式，然后为所有行赋予

class

属性

---

更好的方法是使用a和a作为行。这里有一些路径示例。

是的，只需重复

标记，而不用use。您可以在进行转换时使用变换，也可以直接调整坐标。至少在Firefox上会快得多。您可以对填充、笔划等使用CSS样式，然后为所有行赋予

class

属性

---

更好的方法是使用a和a作为行。这里有一些路径示例。

谢谢，我有点希望找到一种方法来减少表示所有绕组所需的行数。svg文件用于电子设计软件[link]（www.fritzing.org），因此速度不是我的问题，只是添加额外行的容易程度。带有包含h元素的d属性的路径看起来最紧凑，不是吗？嗨，罗伯特，也许你能给我举个例子吗？我在回答中添加了一个指向示例的链接谢谢，我有点希望找到一种方法来减少表示所有绕组所需的行数。svg文件用于电子设计软件[link]（www.fritzing.org），因此速度不是我的问题，只是添加额外行的容易程度。具有包含h元素的d属性的路径看起来最紧凑，不是吗？嗨，Robert，也许你可以给我举个例子？我在answerDoes中添加了一个链接，指向使用JavaScript克隆的例子？（您是否仅在支持JS的环境中使用此SVG？）如何将它们以每次使用2/4/8/16绕组的方式批量累积？我无法使用JS克隆它们。不幸的是，我在应用程序（www.fritzing.org）中使用此SVG文件，而不是在web浏览器中使用。使用JavaScript克隆它们是否算数？（您是否仅在支持JS的环境中使用此SVG？）如何将它们以每次使用2/4/8/16绕组的方式批量累积？我无法使用JS克隆它们不幸的是，我在应用程序（www.fritzing.org）中使用此SVG文件-而不是web浏览器。