javascript - d3.js 鼠标悬停

标签 javascript html css svg d3.js

我使用 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" });

最佳答案

问题是文本正在捕获鼠标。这可以通过删除 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

关于javascript - d3.js 鼠标悬停,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18684906/

相关文章:

javascript - 如何在不使用 Flash 的情况下实现图书预览(2 页展开)?

Jquery UI Datepicker 不适用于 bootstrap 和 Firefox

CSS 关键帧 - 回到原点

html - Bootstrap 中进度条的布局问题

html - pixel.gif,为什么人们使用它?

javascript - 修复弹出框并使背景滚动

CSS3 网格布局 : New row after specific element - possible?

javascript - 当我返回 angularJS 中的 ui-view 时,复选框未选中

javascript - 在 MODX 管理器中恢复弹出表单值

javascript - 如何隐藏 NaN (JavaScript)