d3懸停在傳說中，如何確定編號

Question

我試圖確定當我將鼠標懸停在某個圖例項目上時，如何知道我將鼠標懸停在哪個圖標上。

// draw legend colored rectangles 
legend.append("rect") 
    .attr("x", width + 170) 
    .attr("width", 18) 
    .attr("height", 18) 
    .on("mouseover", function(d) { 
    }) 
    .style("fill", color); 

現在，在圖例中有3個矩形。我如何獲得我懸停的矩形的ID？

Answer 1

在鼠標懸停處理程序中，this是觸發事件的DOM元素。所以你可以做類似

.on("mouseover", function(d) { 
    d3.select(this).attr('id');// presumes that <rect> has an id! 
}) 

要分配id到rect，你可以調用.attr('id', 'some_id')就可以了。

但是，如果你處於一個階段，你還沒有對rects有id（儘管你標題爲你的帖子），然後考慮按順序使用d3的數據綁定和enter，update，（exit）選擇創建您的圖例，並在"mouseover"函數中使用d來確定正在與哪個圖例元素進行交互（而不是使用DOM元素上的id）。