Dart SVG 矩阵变换答案

【问题标题】：Dart SVG Matrix TransformationDart SVG 矩阵变换
【发布时间】：2014-07-27 17:28:33
【问题描述】：

我正在尝试创建一个类（在 Dart 中），使 SVG 组可通过矩阵进行转换。我尝试使用“setAttribute”路由，它适用于单个 SvgElement：

转换类：

  String _x;
  Element _transformElement;

  void setX(int value)
  {
    _x = value.toString();
    _transformElement.setAttribute('x', _x);
  }

飞镖文件：

Transform test = new Transform('testObject');

void main()
{
  test.setX(25);
}

但是，我希望能够让所有的二传手都通过一个矩阵运行。这是我的代码：

转换类：

Matrix _matrix;

void setX(int value) => setTransform(x: value);

void setTransform({int scaleX: null, int skewX: null, int skewY: null, int scaleY: null, int x: null, int y: null})
{
  _matrix.a = scaleX;
  _matrix.b = skewX;
  _matrix.c = skewY;
  _matrix.d = scaleY;
  _matrix.e = x;
  _matrix.f = y;

  _transformElement.setAttribute('width', _matrix.a.toString());
  _transformElement.setAttribute('height', _matrix.d.toString());
  _transformElement.setAttribute('x', _matrix.e.toString());
  _transformElement.setAttribute('y', _matrix.f.toString());
}

我的错误是 _matrix 为空。另外，我希望这适用于一组 SVG 对象，而不仅仅是一个 SVGElement

【问题讨论】：

您能否详细说明您要完成的工作。一个具体的（最小的）SVG 示例以及您想要对它们进行的转换。 stackoverflow.com/questions/22791926、stackoverflow.com/questions/20873601这些问题你看过了吗？
你没有给matrix赋值，这就是为什么它是null。有关详细信息，请参阅我对 stackoverflow.com/questions/20873601 的回答。

标签： svg dart

【解决方案1】：

你可以调用createSVGMatrix来获取一个你可以操作的矩阵

如果您正在处理 SVG 文档，那么您可以这样称呼它。

var matrix = document.documentElement.createSVGMatrix();

如果您有一个包含内联 SVG 的 html 文档，那么您需要获取根 SVG 元素并在其上调用 createMatrix()。

【讨论】：