javascript - d3.js onmousehover

Question

このコードはd3.jsを使用して記述しました。

これが私の問題です：

四角形の上にマウスを移動すると、ポップアップ ツールチップが表示されますが、ポインタが四角形内のテキストの上にあるときは表示されません。

マウスがテキストや図形の他の部分の上にあるときにツールチップが表示されるようにしたいと思います。これはどのように達成できますか？

長方形のコードは次のとおりです。

cartridgeRectangles.push({"x_axis":startx+2, "y_axis":90+textbeginy, "width":35,       "height":15, "color":discovery_status_color, "stroke":"#33CC33", "thickness":1, "mover":chassisDetails , "movercolor":"darkgreen", "mout":"True", "moutcolor":"#33CC33" });

Answer 1

問題は、テキストがマウスをキャプチャしていることです。これは、CSS のテキストのポインター イベントを削除することで回避できます。

// This will apply to all text elements, consider using a class
text {
  pointer-events: none;
}

ポインター イベントの詳細: https://developer.mozilla.org/en-US/docs/Web/CSS/pointer-events