javascript - 光标远离javascript图表的工具提示

Question

我已经为图表制作了工具提示，但光标远离工具提示。特别是当我在大显示器上测试它时。我把它放在这里:http://jsfiddle.net/u4daX/15/为了看到问题，您应该使结果窗口更大，以便您可以看到工具提示与光标指向的位置保持一定距离。你能给我一些该怎么做的提示吗？您认为我应该对这部分进行更改吗？

   .line1 {
    fill: blue;
    stroke: blue;
    stroke-width: 1px;
    opacity: 0.7;
   }
   .line2 {
    fill: green;
    stroke: green;
    stroke-width: 1px;
    opacity: 0.7;
   }
   .line3 {
    fill: orange;
    stroke: orange;
    stroke-width: 1px;
    opacity: 0.7;
   }

谢谢

Answer 1

移动光标时工具提示的位置会计数，这意味着您必须查看 JS 源来更改它，而不是 CSS。

在 JavaScript 代码的源代码中，有以下几行:

div.text( hours + ":" + minutes + suffix + ", " + d3.event.pageY)
    .style("left", (d3.event.pageX ) + "px")
    .style("top", (d3.event.pageY ) + "px");

它们使用填充工具提示的文本并更改其位置。如果您添加/减少“left”和“top”样式的值，您将得到您想要的。

结果:Working example

div
    .text( hours + ":" + minutes + suffix + ", " + d3.event.pageY)
    .style("left", (d3.event.pageX - 50 ) + "px")
    .style("top", (d3.event.pageY - 30 ) + "px");