我已经创建了一个基本的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>
答案 0 :(得分:1)
是的,只需重复<line>
标记而不是使用。您既可以使用变换,也可以直接调整坐标。至少在Firefox上它会快得多。您可以使用CSS样式进行填充,描边等操作,然后为所有行添加class
属性。
最好还是使用path并使用l or L or for your data - h or H作为行。路径here有一些例子。