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更多信息在這種情況下會有所幫助。