SVG path 参数是用来定义图形的指令集,这些指令可以包括直线、平滑曲线、圆弧、圆、矩形等。
下面是一些常用的参数:
M = moveto:将画笔移动到指定的坐标
L = lineto:画直线到指定的坐标
H = horizontal lineto:画水平线到指定的X坐标
V = vertical lineto:画垂直线到指定的Y坐标
C = curveto:三次贝塞尔曲线
S = smooth curveto:平滑三次贝塞尔曲线
Q = quadratic Belzier curve:二次贝塞尔曲线
T = smooth quadratic Belzier curveto:平滑二次贝塞尔曲线
A = elliptical Arc:圆弧
Z = closepath:关闭路径
例如,下面的 SVG path 定义了一个简单的正方形:
<path d="M10 10 H 90 V 90 H 10 Z" />
解释:
M10 10 是移动到点 (10,10)
H 90 是画一条水平线到 X 坐标 90
V 90 是画一条垂直线到 Y 坐标 90
H 10 是画一条水平线到 X 坐标 10
Z 是关闭路径,回到起点形成闭合图形
这个参数列表是非常全面的,可以创建各种复杂的图形。记住,所有的指令都是大小写敏感的。