d3追加svg扩展名的图像

Question

我正在尝试将带有'.svg'扩展名的svg图像添加到我的图表中（使用d3创建的另一个svg图像）。

这是代码：

d3.select("#chart1 svg")
  .append("svg:image")
  .attr("xlink:href", "img/icons/sun.svg")
  .attr("width", 40)
  .attr("height", 40)
  .attr("x", 228)
  .attr("y",53);

如您所见，我正在设置“xlink：href”属性，但d3会在浏览器中将其更改为href：

<image href="img/icons/sun.svg" width="40" height="40" x="228" y="53"></image>

事实上，如果我使用png扩展名，这段代码可以正常运行。有什么想法吗？

Answer 1

代码应该按原样运行 - 在这里你可以看到一个将.svg文件附加到d3的例子：

http://jsfiddle.net/am8ZB/

不要忘记图片实际上是可能的，但你却看不到它 - 您应该使用浏览器开发人员工具检查页面，以查看图片是否已放置在视图区域之外（例如，由于您的x / y值）。

#chart1的更多信息在这种情况下会有所帮助。