Svg动态电力开关演示

1.线路图

先用svg绘制线路图，在该线路中添加2个开关和1个电阻，电阻添加颜色渐变效果，开关和电阻上方显示文字编号，最右侧添加1个箭头。
SVG线路图源码

<defs>
				 <g id="lineG1" transform="translate(30,70)rotate(-90)">
					  <line id="line1" fill="none" stroke="#00FF00" stroke-width="3" x1="10" y1="30" x2="10" y2="40"/>
					  <line id="lineA" fill="none" display="none" stroke="#00FF00" stroke-width="3" x1="10" y1="40" x2="10" y2="70"/>
					  <line id="line2" fill="none" stroke="#00FF00" stroke-width="3" x1="10" y1="40" x2="35" y2="60"/>
					  <line id="lineB" fill="none" stroke="#00FF00" stroke-width="3" x1="10" y1="70" x2="10" y2="80"/>
					  <circle cx="10" cy="40" r="4" stroke="#00FF00"  stroke-width="2" fill="#000000"/>
					  <circle cx="10" cy="70" r="4" stroke="#00FF00"  stroke-width="2" fill="#000000"/>
				 </g>
				 <g id="lineG2" transform=