如何将SVGMatrix应用于点数组？

Question

是否有内置库将点向量乘以SVGMatrix？

我有一个已缩放的SVG工程图，我想在其原始坐标系中用在屏幕空间中具有固定宽度的线注释该工程图。 （也就是说，放大或缩小时，线条不应改变宽度，但是图像中的线条当然可以。）因此，我的方法是在内对图像进行变换，然后获取点数组并应用相同的变换，然后使用这些转换点在根级别创建一个新的路径对象。

我正在寻找最干净的方法来做到这一点。

Answer 1

svg元素具有创建矩阵对象和点对象的方法。 矩阵对象具有用于矩阵运算的方法（例如，乘法，转换，缩放等）。 点对象具有应用矩阵变换的方法。

例如...

var svg = document.getElementById("mySvg");
var matrix1 = svg.createSVGMatrix();
var matrix2 = matrix1.translate(2, 3);
var point1 = svg.createSVGPoint();
point1.x = 1;
point1.y = 1;
var point2 = point1.matrixTransform(matrix2);

矩阵和点对象的文档可以在下面找到。

http://www.w3.org/TR/SVG/single-page.html#coords-InterfaceSVGPoint http://www.w3.org/TR/SVG/single-page.html#coords-InterfaceSVGMatrix