禁用鼠标悬停交互 JointJS 图

Question

我正在尝试删除发生在 links 和 Rect 上的鼠标悬停操作。

我尝试将 interactive: false 添加到 joint.dia.Paper 对象 - 这并没有完全帮助。我仍然看到鼠标悬停的变化。我希望 link（特别是）在鼠标悬停时不响应。

如何实现？

Answer 1

要理解这一点，您必须了解链接的 SVG 标记是如何构建的。文档解释得很好：

http://jointjs.com/tutorial#link-styling

如果您需要检查有关 CSS class 结构的更多详细信息，我发现在您的浏览器上使用 Inspect Element 很有用。

一旦你理解了这一点，你就会发现你可以使用 CSS 来完成你所要求的。如需演示，请查看此处：

http://jsfiddle.net/azt8jpam/1/

对于链接，您需要在 connection-wrap、link-tools、marker-vertices 和 marker-arrowhead class 上设置 display: none。

为了完整起见，您还可以在形状上设置 cursor: auto。例如

.element.basic.Rect {
    cursor: auto
}