html - Dart svg ImageElement 未显示

Question

我尝试添加 ImageElement到 GElement .虽然 <image>元素是在 <g> 下创建的正确地，它没有出现。如果我复制 <image>由 Dart 创建的元素，并预先将其添加到 html 文件中，它显示了。我正在使用以下代码片段:

ImageElement aImage = new ImageElement();
aImage.setAttribute('x', '$x');
aImage.setAttribute('y', '$y');
aImage.setAttribute('width', '30');
aImage.setAttribute('height', '30');
aImage.setAttribute('xlink:href', 'http://icons.iconarchive.com/icons/deleket/sleek-xp-software/256/Yahoo-Messenger-icon.png');
group.append(a);

Answer 1

您必须使用 getNamespacedAttributes 设置 href(参见 this)。此外，确保组元素位于 SvgSvgElement 上。这对我有用:

svg.SvgSvgElement svgBase = new svg.SvgSvgElement();
svg.ImageElement aImage = new svg.ImageElement();
svg.GElement group = new svg.GElement();


aImage.setAttribute('x', '50');
aImage.setAttribute('y', '50');
aImage.setAttribute('width', '30');
aImage.setAttribute('height', '30');
aImage.getNamespacedAttributes('http://www.w3.org/1999/xlink')['href'] = 'http://icons.iconarchive.com/icons/deleket/sleek-xp-software/256/Yahoo-Messenger-icon.png';

group.append(aImage);
svgBase.append(group);
querySelector('#container').append(svgBase);