2

折れ線グラフがあります。ユーザーがその線上の点にマウスを置いたときに、円を表示したい (これを参照)

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");
      });

最初に円の表示を「なし」に設定し、ユーザーがマウスでその上にカーソルを置いたときに表示されるようにしました。その後、マウスアウトすると再び非表示になります。ただし、マウスオーバーしても円が表示されません。私は何を間違っていますか？

4

1 に答える 1

1

円が何も表示されないように設定されている場合、そもそもイベントをキャッチするものは何もありません。円のトリガーとして別の要素を使用してみてください。

于 2012-11-02T01:26:42.200 に答える