【发布时间】：2012-04-17 23:21:44
【问题描述】：
我这样绘制 SVG 路径：
开始：
M x, y
添加曲线
Q x1, y1, x, y
等等等等......当我想关闭路径时，我只需添加Z
但最后一条线段现在没有任何控制点。
如何关闭路径并在最后一段上设置控制点？
类似于：Z Q x1, y1 其中 Z 关闭路径（当前点到第一个点），但它使用 x1 和 y1 作为控制点，而不仅仅是直线。
【问题讨论】：
【发布时间】：2012-04-17 23:21:44
【问题描述】：
我理解你的愿望。每次我在 Illustrator 中徒手绘制斑点时，我总是将最终点设置在原始点上，然后拖动以创建两边控制点的切线。
SVG 没有这样的功能。没有path command 可以做到这一点。最接近的是速记路径命令S 和T，但它们从 previous 命令的最后一个控制点派生 first 控制点，而您想要的是从 next 命令上的第一个控制点派生 second 控制点的东西（环绕式）。
您可以使用 JavaScript 来做到这一点，例如标记喜欢
<path d="… Z" class="smooth-close" />
...还有一个小脚本，它可以找到所有smooth-close 路径，根据第一条命令确定适当的控制点，并生成S 或T 命令并将其附加到路径数据中。但是由于您没有使用javascript 标记您的问题，我认为您不会对这样的解决方案感兴趣。
【讨论】：
-
我没有将它标记为 javascript，因为我想知道 SVG 是否支持它。我正在使用 fabricJS 在画布上绘制路径，它的行为与 SVG 完全一样。我可以从当前点再添加一条线到第一个点并在视觉上关闭路径，然后调用 Z。但它仍然会留下没有控制点的那条线。
-
FWIW 如果您使用 Adobe Illustrator 从两个点（和四个控制点）创建一个椭圆，您将获得类似
M0,0 c0,-50,100,-50,100,0 S0,50,0,0 z的路径数据；因此，它完成了我在上面的 JavaScript 中描述的操作，使用恰好切向镜像第一个控制点的控制点手动关闭曲线。然后，正如你所说，它仍然会抛出一个（多余的）零距离z来正式关闭路径。 -
我按照我的描述做了。我只是添加了法线曲线，但对于曲线的末端，我给出了路径的起始坐标。然后我用 Z 关闭路径。在我的实现中，我知道我是否按下了那个点，然后我控制了路径的开始和结束。 （希望大家理解，不知道怎么解释更好）