1、 PATH元素
SVG的元素用于定义一些复杂的图形。它可以结合使用直线,曲线等来制作各种不规则的图形。
A30,30 0 0,1 35,20
L100,100
M110,110
L100,0"style="stroke:#660000; fill:none;"/>
所有的这些绘制工作都是在元素中通过d属性来完成的。属性包含了一些用于绘制的命令。在上面的例子中,M命令代表“Move to”(移动到)的意思。A命令代表一个“arc”(弧线)。L命令代表“Line”(直线)。这些命令都由一支“虚拟的画笔”来执行,这支笔可以移动和绘制图形
2、设置和移动虚拟画笔
移动画笔通过M指令来完成
将虚拟画笔移动到(50,50)坐标的位置上
3、直线
直线命令是元素最简单的命令。绘制直线使用L或l指令
L100,100"style="stroke:#660000; fill:none;"/>
从(50,50)坐标开始绘制一条直线,直线的终点在(100,100)的位置
4、弧线
A30,50 0 0,1 100,100"style="stroke:#660000; fill:none;"/>
从(50,50)开始绘制弧线,结束点位置在(100,100)
arc(rx,ry x-axis-rotation large-arc-flag,sweep-flag,rx2,ry2)
弧线的半径有A指令的两个数值决定。第一个参数是rx,水平方向上的半径,第二个参数是ry,垂直方向上的半径。
A指令上的第三个参