6

我是使用 Dart 的新手，我一直在尝试移植一些与 svg 一起使用的 javascript 代码，创建一个包含一些段的路径，但我很难理解它的 API 是如何工作的.

以下代码不会运行，但它可能说明了我想做的事情：

Element i = query("#divsvg");
svg.SvgSvgElement s = new svg.SvgSvgElement();
i.append(s);

svg.PathElement p = new svg.PathElement();
p.pathSegList.add(
      p.createSvgPathSegArcAbs(200, 200, 50, 50, 180, false, false)
   );

s.children.add(p);

但是，据我从文档中了解到：

  • createSvgPathSegArcAbs 创建一个非父路径段
  • pathSegList 是最终的，所以你不能在构建后添加它
  • PathElement 构造函数似乎没有接受任何参数

我是否遗漏了有关 Dart 的工作原理或 svg 库文档中的某些内容？我花了几个小时查看文档、谷歌搜索和查看测试，但我没有找到任何似乎涵盖这一点的东西（测试似乎使用 HTML 代码而不是 API 创建东西）。

任何指出我正确方向的东西都将不胜感激！

更新

我花了更多时间查看函数，并且 pathSegList 的“最终性”不应该阻止它被更改（它不是 const），只是被替换了。

但是，如果您尝试调用它们，像“add”这样的各种函数会显式地实现异常，而一些函数（如 append）是本机实现的。

根据调试器：

p.pathSegList.append(
    p.createSvgPathSegArcAbs(200, 200, 50, 50, 180, false, false)
);

将附加一个路径段，但这不会出现在“innerHTML”属性中，也不会出现在最终页面的 HTML 中......

我开始认为 svg 支持根本不是“完成”，并且有点想只移植到画布和/或 WebGL。

4

1 回答 1

2

我能够使用 PathSegList 的 appendItem 方法创建一个路径元素并向其添加路径段：

var div = query('#container');
var svgElement = new svg.SvgSvgElement();
div.append(svgElement);
path = new svg.PathElement();
svgElement.append(path);

segList = path.pathSegList;

segList.appendItem(path.createSvgPathSegMovetoAbs(50, 50));
segList.appendItem(path.createSvgPathSegArcAbs(200, 200, 50, 50, 180, false, false));
segList.appendItem(path.createSvgPathSegClosePath());
于 2013-08-01T15:05:41.167 回答