svg学习记录（四）

前面学习了基本图形的绘画后，我们将更深入的学习SVG中的path路径绘制。

小写命令符的区别

在上一篇文章中的两个例子，我们的命令都是使用大写字母的方式来绘制我们的图形的，其实也可以使用小写字母的方式来绘画。但，小写字母是相对命令，类似于电脑中的相对路径和绝对路径，它们的参数不是指定一个明确的目标，而是表示相对于它前面的点需要移动多少距离。例如前面的示例，画的是一个200*100的矩形，用相对命令可以这样描述：

<path d="M10 10 h 200 v 80 h -200 Z" fill="red"/>

以上代码，我们先将画笔定在了10，10处，使用L命令的简写方法，从这里开始，将画笔往右边移动200px，构成一条水平线，再向下方移动100px，再向左边移动100px，最后使用Z闭合命令将图形闭合起来。这样就形成一个200*100的矩形了。

曲线的绘画

在前面的path例子，你可能会有这样子的疑问：我们可以通过rect、polyline 、 polygon 标签实现，这样子更简单。为什么要使用path呢？

如果你只是画直线，那么其他元素可能会更好用，但是，path却是众多开发者在