1

我创建了一个基本的 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>
4

1 回答 1

1

是的，只需重复<line>标签而不是使用 use。您可以按照自己的方式使用变换，也可以直接调整坐标。至少在 Firefox 上它会快得多。您可以使用 CSS 样式进行填充、描边等，然后为所有线条赋予class属性。

更好的是使用路径并使用l 或 L 或用于您的数据 - h 或 H 用于行。这里有一些路径示例。

于 2012-11-13T04:10:15.933 回答