在D3餅圖上懸停傳奇時爆炸餅圖片

Question

我創建了一個餅圖，使用D3.js以及傳說來匹配餅圖切片。

我能夠在鼠標懸停和鼠標懸停事件上爆炸一個餅圖片。

我需要展開一個餅圖切片，並將鼠標懸停在圖例上時顯示一個與餅圖切片對應的值的工具提示。

任何指針，以實現這一點表示讚賞。

Answer 1

給每個'切片'一些文字。爲此文本提供一個ID，並將該文本的ID可見性設置爲隱藏在CSS中。在鼠標懸停（或任何時候想要顯示工具提示）時，請取下隱藏的課程，從而顯示文本。

var slice = d3select(slice) 
.append("text") 
.attr("id", function(d,i) 
{ 
return "text" + i; 
} 
.classed("hidden", true); 

slice.on("mouseover" function(){ 
d3.select(this) 
.classed("hidden", false); 
} 

.hidden{ 
visibility:hidden; 
} 

這不會與你的工作，但顯然，因爲我不會選擇正確的元素。如果你提供的jsfiddle那麼也許我可以看到，如果我可以告訴你它的工作:)

Answer 2

我這是怎麼實現的圓形切片的爆炸在上空盤旋創造附加圓形切片時，傳說

1） 2）在圖例上的鼠標移動功能上，我使用 var id = path [id ='「+ this.textContent +'']得到了id的值，該值與我作爲圖例顯示的值相匹配（標籤） 「 3）使用d3.select使用我們在步驟2中獲得的路徑 4）使用選擇來做餅片的爆炸。