如何展平转换后的 svg 路径

Question

我正在尝试使用 Snap.Svg javascript 库从先前转换的路径在 svg 中创建一个新的路径字符串。新路径字符串必须在创建时将旧转换融入其中。问题是我不确定 is.I 查看此线程的正确方法是什么 but when I try to get the matrix to object to add to this method in snap.svg I get undefined. How can I get the transformation matrix object from the DOM node as shown in this example . The relevant method in the snap library I think is http://snapsvg.io/docs/#Snap.path.map

我的代码：

   var result = d3.select(".line").node();
   console.log(result.transform.baseVal.consolidate().matrix);

以上returns无效。如何 create/get 正确的变换矩阵对象以便我可以使用 Snap.path.map 方法？

Answer 1

不确定您使用的是 d3 还是 Snap，所以答案可能会有所不同。如果是 Snap，您可以考虑从

获取矩阵

element.transform().localMatrix or 
element.transform().globalMatrix

然后使用该矩阵使用

Snap.path.map( pathString, Matrix )

从 http://snapsvg.io/docs/#Snap.path.map 应用该转换

如果您需要获取转换字符串，可以从

获取

somepath.attr('d')

如何展平转换后的 svg 路径

How to flatten a transformed svg path

d3.js

snap.svg

web-frontend