D3js追加嵌套元素

Question

我有d3js強制佈局。我試圖追加到每個節點的嵌套元素。 下面是代碼：

node 
    .append("div") 
    .attr("width", 60) 
    .attr("height", 60); 

    node.select("div") 
     .append("image") 
      .attr("xlink:href", function(d) 
      { 
       return d.url 
      }) 
      .attr("x", -8) 
      .attr("y", -8) 
      .attr("width", 30) 
      .attr("height", 30); 

    node.select("div") 
     .append("text") 
      .attr("dx", 12) 
      .attr("dy", ".35em") 
      .text(function(d) { return d.name }); 

，我得到的結果是這樣的：

<div width="60" height="60"> 
    <image xlink:href="image.jpg" x="-8" y="-8" width="30" height="30"> 
    </image> 
    <text dx="12" dy=".35em">mp3</text> 
</div> 

的問題是，我沒有看到的圖像和文字。

怎麼辦？

感謝

Answer 1

使用g組件，它具有變換把你的元素在正確的地方。如果你想使用div而不是g，你必須將div放在svg之上。

#canvas { 
    position: relative; 
} 
#canvas.div { 
    position: absolute; 
    top: 320px; 
    left: 150px; 
} 

canvas是你追加你的svg的地方。我用這種方法在這裏：

http://vida.io/documents/SuRAGDs7J78HCvoxE