追加されたテキストは、私はちょうどテキストを表示私のSVGへのdivを追加しようとしている、これは単純な問題である</p> <p>を望んでいる

Question

d3.js表示されません。私はこれのためのコードを開発しました。そして、DOMの中で、私のsvgにクラスが付属していることを示しています。ただし、ページにはテキストは表示されません。

誰かが間違っていることを指摘できると思っていますか？

ここにコードがあります。

http://plnkr.co/edit/LxD1TarajR8dZUS7MbHg?p=preview

var vis = d3.select("#chart").selectAll("svg") 
    .data(dataset) 
    .enter() 
    .append('svg') 
    .attr("class", "svgCircle") //Append svg class 
    .attr('width', width) 
    .attr('height', height) 
    .append('g') 
    .attr("transform", "translate(" + width/2 + "," + height/2 + ")") 

vis.append("circle") 
    .attr("fill", "#ffffff") 
    .attr("stroke", "#dfe5e6") 
    .attr("stroke-width", 1) 
    .attr('r', width/2) 

d3.selectAll(".svgCircle") // append label to circles 
    .append("div") 
    .attr("class", "circleLabel") 
    .append("text") 
    .text(function(d) { 
    return d.label 
    }) 

Answer 1

を。

この代わりに、私はSVGの道を行く

結果勧めしたい：私はより多くの制御を持っているでしょう、あなたの "とは対照的に、あなたは、テキストのすべての属性を制御することができますhttp://plnkr.co/edit/rb18RQTT7tBeo8lJXVpO?p=preview

d3.selectAll(".svgCircle") 
    .append("text") 
    .text(function(d) { 
    return d.label 
    }) 
    .style("stroke","black") 
    .attr("dy", "1em"); 

は、テキスト等の位置を超えて "コメント。私はちょうどdy属性とstroke属性を与えましたが、好きなようにあなたのテキストを色付けして形を整えることができます

Answer 2

あなたはSVG要素内のdivを置くことができる、それが現れていません。

おそらくinsert機能の代わりappend使用したい：@RobertLongsonはあなただけ（IEでは動作しません）foreignObjectでSVGにHTMLを入れることができます言ったように https://github.com/d3/d3/wiki/Selections#insert