将 D3 工具提示放置在光标位置

Question

我在可视化中使用d3-tip。我现在想为非常宽且可能超出可见画布的元素添加工具提示。默认情况下，工具提示显示在对象的水平中心，这意味着在我的情况下，工具提示可能不在可见区域中。我需要的是显示在光标水平位置的工具提示，但我不知道如何正确更改工具提示位置。我可以设置一个偏移量，我可以得到光标的坐标，但我不能得到的是工具提示的初始位置，这样我就可以计算出正确的偏移量。我也不能设置绝对位置：

            .on("mouseover",function(d){
                var coordinates = [0, 0];
                coordinates = d3.mouse(this);
                var x = coordinates[0];
                var y = coordinates[1];
                tip.offset([-20,20]); // this works
                tip.attr("x",40); // this doesn't
                tip.show(d);
            })

Answer 1

如果要使用offset，可以在tip.show(d)之后得到tooltip的初始位置：

tip.style('top');
tip.style('left');

同理，设置绝对位置：

.on('mouseover', function(d){
        var x = d3.event.x,
            y = d3.event.y;

        tip.show(d);

        tip.style('top', y);
        tip.style('left', x);
      })

Answer 2

前面所说的答案对我不起作用（并且不能修改为“建议的编辑队列已满..”），但经过一些小的调整，它工作正常：

.on('mouseover', function(d){
    var x = d3.event.x,
        y = d3.event.y;

    tip.show(d);

    tip.style('top', y-10 + 'px'); // edited
    tip.style('left', x+'px'); // edited
  })