SVG：简化路径以去除曲线？

Question

我有一个包含贝塞尔曲线路径的svg文件。 我需要将这个路径数据转换为html map-area所使用的坐标，因此实际上我只需要坐标（但对于较大的曲线，拥有一些“在”两个端点之间的坐标非常好）。

我尝试了Inkscape的简化路径功能，但这些路径仍然包含曲线...

是否有任何工具或公式可以将这些曲线转换为简单的坐标？

也许有另一个Inkscape输出格式，在其坐标中不使用曲线？

- Dylan

---

如果你只需要坐标，难道不能使用脚本从SVG文件中提取出来吗？ - Jeroen Baert

Answer 1

在Inkscape中：

1. 选择通过节点编辑路径工具 (F2)
2. 点击你要选择的路径
3. Ctrl+A选择该路径内的所有节点
4. 点击在所选线段插入新节点。如有需要，可以重复多次以展现曲线的形状。
5. 然后点击使所选线段变成直线

这些选项位于顶部工具栏上，即加号图标和两个方形节点之间的直角对角线。

- Peter Collingridge

Answer 2

想要自动化操作，可以尝试使用Inkscape中包含的Flatten Bezier扩展。具体描述请点击这里。

- Jet Blue

---

这比“将选定的线段转换为直线”要好得多，因为它实际上会添加节点以近似曲线。 - Laurence Gonsalves

这是正确的解决方案。它解决了问题中关于“对于大曲线，我们很想在两个端点之间有一些坐标”的部分。在Inkscape 0.92中，该扩展位于“扩展”>“修改路径”>“平化贝塞尔曲线…”下面。 - Attila Tanyi

可以使用“使选定的线段成为直线”来实现这一点。然而，被接受的答案完全忽略了关键步骤。我已经编辑它以添加这个步骤：在“使选定的线段成为直线”之前使用“在选定的线段中插入新节点”。 - Ash

Answer 3

有一种更技术化的方法可以简化SVG路径- https://github.com/mattdesl/simplify-path

var path = [ [250, 150], [250, 150], [25, 25], [24, 25], [10, 10] ]
var tolerance = 10
path = simplify(path, tolerance)
//result:
//[ [ 250, 150 ], [ 25, 25 ], [ 10, 10 ] ]

- mykola.rykov