如何將文本添加到D3陽光圖的中心

我正在使用zoomable sunburst example，但我努力嘗試向圖的中心添加文本，並使其可縮放。這個想法是，當我點擊指示其長度的某個弧線時，中心的文字會發生變化。似乎mouseclick和mouseover的屬性消失了。這是我曾嘗試：如何將文本添加到D3陽光圖的中心

path.append("svg:text") 
     .on("click",click) 
     .style("font-size","4em") 
     .style("font-weight","bold") 
     .text(function(d) { return count_function(data); });

有人可以幫助我瞭解如何不失點擊功能顯示在圖表的日中央的文字？

也許更簡單的方法是選擇代表圓形中心的「g」，並在圖表顯示後向其添加文本。我試過這個，但是我無法成功地選擇這個元素（對不起，我是D3的新手），所以回到原點。

來源

2013-02-21 user2095356

看起來您正試圖在path元素內插入text元素。嘗試這樣的：

svg.select("g").append("svg:text") 
    .on("click",click) 
    .style("font-size","4em") 
    .style("font-weight","bold") 
    .text(function(d) { return count_function(data); });

來源

2013-02-21 12:51:35

非常感謝Richard！但它仍然無法正常工作。我可以看到第二個文本，因爲它被第一個圓圈的填充所隱藏。 – user2095356 2013-02-21 13:02:28

只是猜測，但是是首先宣佈的文本？ SVG中沒有z-index，因此元素的順序會影響哪些元素可以被看到。 – 2013-02-21 14:58:59

是的，文字很好。如果遵循您的建議並在創建svg後將文本追加到「g」元素，我已設法使其可見。但是，當我進行轉換時，我丟失了文本。 – user2095356 2013-02-21 15:11:00

如何將文本添加到D3陽光圖的中心

回答

相關問題