请解释 SVG 路径命令和坐标
Please explain SVG Path Commands and Coordinates
在 SVG 文件中，我找到了一个如下所示的路径：
<path id="kvg:0548b-s7" kvg:type="㇐b" d="M65.32,48.38c5.65-0.95,12.61-2.46,18.92-3.42c2.05-0.45,4.13-0.5,6.23-0.13"/>
谁能解释坐标 48.38c5.65-0.95 和 18.92-3.42c2.05-0.45 代表什么？
SVG 的 <path> 标签的 d 属性包含一系列指令或描述，这些指令或描述被处理以创建 SVG 的整体形状。这些指令可以是不同的类型：
- Moveto :: 在其他地方重新启动路径（
M 或 m 语法）
- Lineto :: 画一条直线（
L 或 l 语法，或 H 和 V，或h 和 v)
- Curveto :: 绘制三次贝塞尔曲线（
C 或 c 语法）
- Arcto :: 绘制椭圆曲线（
A 或 a 语法）
- ClosePath :: 画一条直线到路径的起点（
Z 或 z 语法）
大写字母语法表示给出绝对位置值。小写语法表示相对位置值跟随，这意味着后续坐标位于当前控制点的右下方。
d 属性中为您的 SVG 提供的说明以大写 M 开头，表示 Moveto 命令的绝对位置值。但也有小写的 c 命令，表示 Curveto 指令集的相对值。
关于你问的第一个坐标...
Moveto 命令有两个参数。在您查询的第一个值的第一段中，48.38 是 y 轴参数（在 65.32 的 x 参数之后）对于 Moveto 命令。剩下的c5.65-0.95是新的Curveto指令集的开始。
Curveto 命令有三个参数，由 x 和 y 对组成，每个参数由破折号 (-) 分隔。由于它以小写 c 给出，后面的值是相对的。第一对是开始曲线的控制点，第二对是结束曲线的控制点，第三对是定义曲线开始的当前点的坐标。
关于你问的第二组坐标...
18.92-3.42是第一个Curveto命令定义的当前点（第三个参数），c2.05-0.45 是下一个 Curveto 命令的第一个参数，它控制贝塞尔曲线的起点。
这些值中的点是小数点。
如果您采用 d 属性并将其拆分，根据文档中定义的参数数量，每个命令，指令集变为 much more readable.
有关 d 属性的更多信息，see here and here。
有关贝塞尔曲线的更多信息，see here。
我认为一些混淆来自格式允许将各个参数分离到各种路径操作数的技巧。所以在例子中：
M65.32,48.38c5.65-0.95,12.61-2.46,18.92-3.42c2.05-0.45,4.13-0.5,6.23-0.13
你看参数
- 用逗号分隔，如 M(ove)65.32,48.38 ...
- 由连字符（减号）分隔，如 c(ubic bezier)2.05-0.45 ...
- 由新操作数分隔，如 ...48.38c5.65...
- 您还会看到由白色分隔的参数 space 而不是逗号
- 如果前面的参数中有一个句点，您甚至可能会看到由一个前导句点分隔的参数
- 有时候你会看到科学计数法中的参数，如 3.22e-9 中，以消除零
由于每种操作数恰好需要一定数量的参数（M,L,T需要2个；H,V需要1个；Q,S需要4个；C需要6个；A需要7个；Z需要0个) 你会看到省略操作数的情况。如果你看到一个 L 后面有 4 个参数，它实际上意味着 2 行，一个 C 后面有 18 个参数，它意味着 3 个立方贝塞尔曲线。
这一切都是为了尽量减少 SVG 中的任何浪费 space，而不仅仅是让它难以阅读。
在 SVG 文件中，我找到了一个如下所示的路径：
<path id="kvg:0548b-s7" kvg:type="㇐b" d="M65.32,48.38c5.65-0.95,12.61-2.46,18.92-3.42c2.05-0.45,4.13-0.5,6.23-0.13"/>
谁能解释坐标 48.38c5.65-0.95 和 18.92-3.42c2.05-0.45 代表什么？
SVG 的 <path> 标签的 d 属性包含一系列指令或描述，这些指令或描述被处理以创建 SVG 的整体形状。这些指令可以是不同的类型：
- Moveto :: 在其他地方重新启动路径（
M或m语法） - Lineto :: 画一条直线（
L或l语法，或H和V，或h和v) - Curveto :: 绘制三次贝塞尔曲线（
C或c语法） - Arcto :: 绘制椭圆曲线（
A或a语法） - ClosePath :: 画一条直线到路径的起点（
Z或z语法）
大写字母语法表示给出绝对位置值。小写语法表示相对位置值跟随，这意味着后续坐标位于当前控制点的右下方。
d 属性中为您的 SVG 提供的说明以大写 M 开头，表示 Moveto 命令的绝对位置值。但也有小写的 c 命令，表示 Curveto 指令集的相对值。
关于你问的第一个坐标...
Moveto 命令有两个参数。在您查询的第一个值的第一段中，48.38 是 y 轴参数（在 65.32 的 x 参数之后）对于 Moveto 命令。剩下的c5.65-0.95是新的Curveto指令集的开始。
Curveto 命令有三个参数，由 x 和 y 对组成，每个参数由破折号 (-) 分隔。由于它以小写 c 给出，后面的值是相对的。第一对是开始曲线的控制点，第二对是结束曲线的控制点，第三对是定义曲线开始的当前点的坐标。
关于你问的第二组坐标...
18.92-3.42是第一个Curveto命令定义的当前点（第三个参数），c2.05-0.45 是下一个 Curveto 命令的第一个参数，它控制贝塞尔曲线的起点。
这些值中的点是小数点。
如果您采用 d 属性并将其拆分，根据文档中定义的参数数量，每个命令，指令集变为 much more readable.
有关 d 属性的更多信息，see here and here。
有关贝塞尔曲线的更多信息，see here。
我认为一些混淆来自格式允许将各个参数分离到各种路径操作数的技巧。所以在例子中：
M65.32,48.38c5.65-0.95,12.61-2.46,18.92-3.42c2.05-0.45,4.13-0.5,6.23-0.13
你看参数
- 用逗号分隔，如 M(ove)65.32,48.38 ...
- 由连字符（减号）分隔，如 c(ubic bezier)2.05-0.45 ...
- 由新操作数分隔，如 ...48.38c5.65...
- 您还会看到由白色分隔的参数 space 而不是逗号
- 如果前面的参数中有一个句点，您甚至可能会看到由一个前导句点分隔的参数
- 有时候你会看到科学计数法中的参数，如 3.22e-9 中，以消除零
由于每种操作数恰好需要一定数量的参数（M,L,T需要2个；H,V需要1个；Q,S需要4个；C需要6个；A需要7个；Z需要0个) 你会看到省略操作数的情况。如果你看到一个 L 后面有 4 个参数，它实际上意味着 2 行，一个 C 后面有 18 个参数，它意味着 3 个立方贝塞尔曲线。
这一切都是为了尽量减少 SVG 中的任何浪费 space，而不仅仅是让它难以阅读。