svg笔记----------path篇

每个路径都必须以moveto 命令开始

moveto、lineto和closepath

<path d="M 10 10 L 100 10z"/>

大写字母命令的坐标是绝对的，小写字母命令的坐标是相对的。其它情况：

1.z(closepath)命令没有坐标，它的大小写形式效果相同。

2.如果使用小写m（moveto）启动路径，它的坐标会被解析为绝对位置，因为没有参照位置来计算相对位置。

水平线和垂直线很常用，足以成为快捷命令。路径可以使用H 命令加绝对x 坐标，或者h命令加相对x 坐标，来指定一条水平线。类似地，垂直线可以使用V 命令加绝对y 坐标，或者v 命令加相对y 坐标来指定。

下面的路径绘制了一个宽度为15 单位、高度为25 单位的矩形。

<path d="M 12 24 h 15 v 25 h -15 z"/>

我们还可以在水平lineto 和垂直lineto 命令后面放置多个坐标值，但只在使用线标记时才会看到效果，H 25 35 45 和H 45 相同，v 11 13 15 和v 39 相同。

所有不必要的空白都可以消除。命令字母后面不需要空白，因为所有的命令都是一个字母。数字和命令之间不需要空白，因为命令字母并不能作为数字的一部分。正数和负数之间也不需要空白，因为负数的前置减号并不能作为正数的一部分。

圆弧命令以字母A（绝对坐标的缩写）或者a（相对坐标的缩写）开始，后面紧跟以下7个参数。

A 命令的7个参数：
• 点所在椭圆的x 半径和y 半径。
• 椭圆的x 轴旋转角度x-axis-rotation。
• large-arc-flag，决定是绘制长弧线还是短弧线。
• sweep-flag，控制弧线的绘制方向，顺时针或逆时针绘制弧线，得到的结果是一种“镜像”效果
• 终点的x 坐标和y 坐标（起点由最后一个绘制的点或者最后一个moveto 命令确定）