5

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

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

知道如何使用fabric.js 做到这一点吗？或任何其他图书馆？还是有人有不同的方法？

下面的图像有一个矩形和一条线都有我在它们的边界上绘制的正方形，我试图在路径元素上做同样的事情矩形和带边界的线

4

4 回答 4

4

我找到了这个

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

它可以获取每个命令及其参数，但您需要从空格中修剪每个命令

于 2012-02-27T20:05:23.010 回答
3

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

var cmdRegEx = /([MLQTCSAZVH])([^MLQTCSAZVH]*)/gi
var commands = d.match(cmdRegEx);
于 2016-12-09T16:52:28.213 回答
2

陷入同样的​​问题。您可以使用 regep /-?\d+/ig 只生成数字，从字母和空格中分离出来。和逗号。

于 2012-03-25T01:02:16.893 回答
0

Python 的svgpathtools库可能对您的需求有用。这是其功能列表（来自文档）：

一些包含的工具：

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
于 2017-02-23T13:22:08.687 回答