Javascript 解析SVG路径元素中的d属性

我正在尝试解析SVG路径元素中的d属性，到目前为止，我发现fabric.js可以解析SVG，但到目前为止我仍然不知道如何解析

我需要解析路径，以获得其中的形状（直线、圆弧）并在其上绘制正方形，最重要的是返回这些正方形的属性

你知道如何使用fabric.js实现这一点吗？？或任何其他图书馆？？或者有人有不同的方法吗

下图有一个矩形和一条直线，它们都有我在它们的边界上画的正方形，我正试图在路径元素上做同样的事情，我发现了这个

var cmdRegEx = /[a-z][^a-z]*/ig;
var commands = d.match(cmdRegEx);

---

它可以获取每个命令及其参数，但您需要从标记为相同问题的空格中修剪每个命令。您可以使用regep/-？\d+/ig，它只生成从字母、空格中分割出来的数字。和逗号。

根据Zeacus的回答和Mark K Cowan的建议，我使用：

var cmdRegEx = /([MLQTCSAZVH])([^MLQTCSAZVH]*)/gi
var commands = d.match(cmdRegEx);

Python的库可能对您的需要很有用。这是其功能的列表（来自）：

其中一些工具包括：

read, write, and display SVG files containing Path (and other) SVG elements
convert Bézier path segments to numpy.poly1d (polynomial) objects
convert polynomials (in standard form) to their Bézier form
compute tangent vectors and (right-hand rule) normal vectors
compute curvature
break discontinuous paths into their continuous subpaths.
efficiently compute intersections between paths and/or segments
find a bounding box for a path or segment
reverse segment/path orientation
crop and split paths and segments
smooth paths (i.e. smooth away kinks to make paths differentiable)
transition maps from path domain to segment domain and back (T2t and t2T)
compute area enclosed by a closed path
compute arc length
compute inverse arc length
convert RGB color tuples to hexadecimal color strings and back

---

美好的标准形式表示法（1e+0）中的数字可能会失败，但我不确定这些数字在SVG中是否有效。我可能会尝试使用此正则表达式：

（/[MLQTCSAZ][^MLQTCSAZ]*/gi

（注：未测试）Mark的反对意见是正确的。这些在SVG规范中声明有效，因此解析不应包含e。XBNF具体是：command.floating-point-constant:分数常数指数？|数字序列指数分数常数：数字序列？.“数字序列|数字序列”。“指数：（“e”|“e”）符号？数字序列