SVG 路径规范：moveTo 和隐式 lineTo答案

【问题标题】：SVG path spec: moveTo and implicit lineToSVG 路径规范：moveTo 和隐式 lineTo
【发布时间】：2015-03-25 09:05:29
【问题描述】：

我正在尝试编写一个小的 SVG 路径解析器/规范化器，并遇到了规范的最后一个问题：

据我所知，大多数命令都支持额外的隐式命令，当它们这样做并且处于相对模式时，“当前点”将在最后一个隐式命令之后更新，而不是在它们之间。

但是“moveTo”命令有些特殊，它允许隐含的“lineTo”命令。而“lineTo”命令它自己只会在最后一个隐式命令之后更新“当前点”：

从当前点到给定的 (x,y) 坐标画一条线成为新的当前点。 L（大写）表示绝对坐标将随之而来； l（小写）表示相对坐标将随之而来。多个坐标对可以是指定绘制多段线。在命令结束时，新的当前点设置为提供的最终坐标集。

我不确定带有附加“lineTo”的“moveTo”的作用。 SVG Path Spec的摘录：

在给定的 (x,y) 坐标处开始一个新的子路径。 M（大写）表示将跟随绝对坐标； m（小写）表示将跟随相对坐标。如果移动是后跟多对坐标，随后的对是被视为隐式 lineto 命令。因此，隐式 lineto 命令如果 moveto 是相对的，则将是相对的，如果 moveto 是绝对的是绝对的。如果相对 moveto (m) 出现在路径，则将其视为一对绝对坐标。在在这种情况下，后续的坐标对被视为相对坐标即使最初的 moveto 被解释为绝对 moveto。

尤其是最后一句话，让人迷惑。

更糟糕的是，他们在SVGTiny Path Spec 中写了另一个描述，而几乎所有其他内容都一样：

将在给定的 (x,y) 坐标处开始一个新的子路径。这还应在给定坐标处建立一个新的当前点。如果一个相对 'moveto' (m) 显示为 'path' 的第一个元素，然后它应被视为一对绝对坐标。如果“移动”是后跟多对坐标，后续对应被视为隐式的“lineto”命令。

这是否意味着“当前点”在两者之间进行了更新（这将与其他所有内容不一致）还是只是他们在新版本中更正的模棱两可的描述？

【问题讨论】：

标签： svg language-specifications

【解决方案1】：

嗯，这一切对我来说似乎都很清楚。

这是用于绘制两个正方形 (100px × 100px) 框的两种模式的图示。第一个使用绝对坐标，第二个使用相对坐标。如规范所述，当第一个坐标用小写的“m”指定时，它被视为绝对坐标，但它后面的所有坐标都被视为相对坐标。

<svg widtn="250" height="140" viewBox="0 0 250 140">
  <g fill="none" stroke-width="5">
    <!-- 1. Move with implicit LineTo (absolute) -->
    <path d="M10,10 110,10 110,110 10,110z" stroke="blue" />
    <!-- 2. Move with implicit LineTo (relative) -->
    <path d="m120,10 100,0 0,100 -100,0z" stroke="red" />
    </g>
  </svg>

【讨论】：

非常感谢，虽然这是一个很奇怪的行为，尤其是因为 lineTo 确实以另一种方式工作。