D3 ...得到一個圓形出現在鼠標懸停並消失鼠標

Question

我有一個折線圖。當用戶將鼠標移動到該行的某個點上時，我想顯示一個圓圈（請參閱this）

我不是使用nvd3，而是使用d3。我有：

svg.selectAll(".dot") 
     .data(data) 
     .enter().append("circle") 
     .attr("r", 1) 
     .attr("cx", function(d) { return x(d.number); }) 
     .attr("cy", function(d) { return y(d.people); }) 
     .style("fill", "white").style("stroke","black") 
     .style("display", "none") 
     .on('mouseover', function() { 
     d3.select(this).style("display","inline"); 
    }) 
     .on('mouseout', function() { 
     d3.select(this).style("display", "none"); 
     }); 

我最初設定的圓的顯示爲「無」，然後可見，當用戶用鼠標懸停在。然後我們再將它們隱藏起來，當他們鼠標移出但是，當鼠標懸停時，圓圈不會出現。我究竟做錯了什麼？

Answer 1

如果該圓圈設置爲不顯示任何內容，那麼首先就沒有什麼可以抓住事件的。嘗試使用另一個元素作爲圈子的觸發器。