Javascript 重叠工具ITP d3.js的问题

我发现可以在折线图上创建工具提示。我现在按照这一点做一个折线图。区别在于我的图表中的工具提示有一个框/背景来包含工具提示中显示的值，因此我添加了

append（'rect'）

和

attr（'fill'，'white'）

为了避免文本和rect的重叠，我根据这里的帖子修改了第292行

到

---

但是，工具提示仍然重叠。有人能帮忙找出问题的原因吗？提前谢谢

矩形可能会重叠，因为您选择它们的方式不同。
为什么不在文本处关闭选择a（保持上面的文本选择不变），但a为rect进行新选择：

d3.selectAll(".mouse-per-line")
    .select("rect")
    .attr("transform", function(d,i) {
        return "translate (5,"+(ypos[i].off - 13)+")";
     });

这对我有用。

---

我根据你最初设置的rect做了翻译。我将第286行的偏移量从15调整到了20-看起来好一点。

谢谢！但是现在文本是重叠的。我的问题是如何选择rect和text。它不应该是。确保没有删除文本选择（第292-296行）。关闭它，并添加我发布的代码作为rect的新选择。另外，增加第286行中使用的位移量，即15，即20或25偶数。

  .select("text")

    .attr("transform", function(d,i) {
        return "translate (10,"+(3+ypos[i].off)+")";
    })

  .selectAll(".tooltipRect, text")

    .attr("transform", function(d,i) {
        return "translate (10,"+(3+ypos[i].off)+")";
    })

d3.selectAll(".mouse-per-line")
    .select("rect")
    .attr("transform", function(d,i) {
        return "translate (5,"+(ypos[i].off - 13)+")";
     });