SVG 路径规范：moveTo 和隐式 lineTo

Question

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

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

但是 "moveTo" 命令有些特殊，它允许隐含的 "lineTo" 命令。虽然 "lineTo" 命令它自己只会在最后一个隐式命令之后更新 "current point"：

Draw a line from the current point to the given (x,y) coordinate which becomes the new current point. L (uppercase) indicates that absolute coordinates will follow; l (lowercase) indicates that relative coordinates will follow. A number of coordinates pairs may be specified to draw a polyline. At the end of the command, the new current point is set to the final set of coordinates provided.

我不确定 "moveTo" 和额外的 "lineTo" 有什么作用。 SVG Path Spec 的摘录：

Start a new sub-path at the given (x,y) coordinate. M (uppercase) indicates that absolute coordinates will follow; m (lowercase) indicates that relative coordinates will follow. If a moveto is followed by multiple pairs of coordinates, the subsequent pairs are treated as implicit lineto commands. Hence, implicit lineto commands will be relative if the moveto is relative, and absolute if the moveto is absolute. If a relative moveto (m) appears as the first element of the path, then it is treated as a pair of absolute coordinates. In this case, subsequent pairs of coordinates are treated as relative even though the initial moveto is interpreted as an absolute moveto.

尤其是最后一句让人费解

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

A new sub-path at the given (x,y) coordinate shall be started. This shall also establish a new current point at the given coordinate. If a relative 'moveto' (m) appears as the first element of the 'path', then it shall treated as a pair of absolute coordinates. If a 'moveto' is followed by multiple pairs of coordinates, the subsequent pairs shall be treated as implicit 'lineto' commands.

这是否意味着 "current point" 在两者之间进行了更新（这将与其他所有内容不一致）或者它只是他们在较新版本中更正的模棱两可的描述？

Answer 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>

SVG 路径规范：moveTo 和隐式 lineTo

SVG path spec: moveTo and implicit lineTo

svg

language-specifications