Javascript D3-使用D3.mouse定位工具提示无效

我正在尝试将工具提示放置在圆上的悬停上

SVG顶部有一个div，它与SVG有高度，由于该div，刀尖位置不正确

示例代码

.on('mousemove', function (d) {
  tooltip
    .html('No data to display.')
    .style('left', (d3.mouse(this)[0] + 20) + 'px')
    .style('top', d3.mouse(this)[1] + 'px')
  })

我仍然可以做这样的事情。样式为'top'，d3.mousethis[1]+100+'px'。这应该行得通，因为我知道上面div的高度

是否有可能使用d3.mouse事件在不向SVG添加上方元素高度的情况下获得Y位置

您可以使用：

.在“mousemove”上，函数d{ 工具提示 .html“没有要显示的数据。” .style'left'，d3.event.pageX+10+'px' .style'top'，d3.event.pageY+10+'px' } 与div一起：

变量a=[{ cx:40， cy:60， r:20 }, { cx:120， cy:80， r:20 }, { cx:200， cy:60， r:20 } ]; 常量工具提示=d3。选择“.tooltip” var circle=d3.selectsvg.selectAllcircle 达塔先生 .on'mouseover'，函数{ 工具提示 .样式“显示”、“块” d3.选择这个 .style'opacity'，1 } .在“mousemove”上，函数d{ 工具提示 .html“没有要显示的数据。” .style'left'，d3.event.pageX+10+'px' .style'top'，d3.event.pageY+10+'px' } .on'mouseleave'，函数{ 工具提示 .style'display'，'none' } 圈。退出。移除； 圆圈 .attr'r'，函数d{ 返回d.r } .attr'cy'，函数d{ 返回d.cy } .attr'cx'，函数d{ 返回d.cx } .样式“填充”、“钢蓝色”； .工具提示{ 显示：无； 位置：绝对位置； 背景色：白色； 边框：1px实心C1C1； 边界半径：5px； 填充物：5px； } 我需要这个部门 您可以改为使用：

.在“mousemove”上，函数d{ 工具提示 .html“没有要显示的数据。” .style'left'，d3.event.pageX+10+'px' .style'top'，d3.event.pageY+10+'px' } 与div一起：

变量a=[{ cx:40， cy:60， r:20 }, { cx:120， cy:80， r:20 }, { cx:200， cy:60， r:20 } ]; 常量工具提示=d3。选择“.tooltip” var circle=d3.selectsvg.selectAllcircle 达塔先生 .on'mouseover'，函数{ 工具提示 .样式“显示”、“块” d3.选择这个 .style'opacity'，1 } .在“mousemove”上，函数d{ 工具提示 .html“没有要显示的数据。” .style'left'，d3.event.pageX+10+'px' .style'top'，d3.event.pageY+10+'px' } .on'mouseleave'，函数{ 工具提示 .style'display'，'none' } 圈。退出。移除； 圆圈 .attr'r'，函数d{ 返回d.r } .attr'cy'，函数d{ 返回d.cy } .attr'cx'，函数d{ 返回d.cx } .样式“填充”、“钢蓝色”； .工具提示{ 显示：无； 位置：绝对位置； 背景色：白色； 边框：1px实心C1C1； 边界半径：5px； 填充物：5px； } 我需要这个部门 非常有用：

您使用的内容取决于SVG在页面上的位置、是否有滚动以及浏览器兼容性需要。

非常有用：

---

您使用的内容取决于SVG在页面上的位置、是否具有滚动功能以及浏览器兼容性需要。

它正在工作。你知道为什么不使用d3.mouse吗？使用d3.event获取显示工具提示的位置是否正确？这是因为d3.mouse提供相对于SVG的边界矩形而不是页面的边界矩形的位置。我可以计算整个svg的边界rec，并将其x、y值与d3.mouse一起添加到左侧顶部样式values@Sam在滚动时还要注意d3.mouse的缺点，如代码段中的示例。如果usedIt起作用，这也需要处理。你知道为什么不使用d3.mouse吗？使用d3.event获取显示工具提示的位置是否正确？这是因为d3.mouse提供相对于SVG的边界矩形而不是页面的边界矩形的位置。我可以计算整个svg的边界rec，并将其x、y值与d3.mouse一起添加到左侧顶部样式values@Sam在滚动时还要注意d3.mouse的缺点，如代码段中的示例。如果使用，也需要处理