将鼠标光标更改为 vis.js 网络节点

Question

有没有办法改变 vis.js 中鼠标光标在网络节点上时的状态？我希望将它们视为指向节点所代表的对象的链接，并且已被要求将光标更改为 "finger" 图标以指示可以单击它。

Answer 1

在 hoverNode 回调中设置 network.canvas.body.container.style.cursor = 'pointer' 并在 blurNode 处理程序中将其设置回 default 就成功了。

Answer 2

为此，首先我们附加 hoverNode 网络事件，当我们悬停在网络的任何节点上时会触发该事件。

network.on("hoverNode", function (params) {
        network.canvas.body.container.style.cursor = 'pointer'
 });

然后我们绑定 blurNode 网络事件，当我们从节点带走房子 (blur) 时触发网络事件。如果我们不附加此事件，您将在整个网络上看到 pointer。

 network.on("blurNode", function (params) {
        network.canvas.body.container.style.cursor = 'default'
 });

您可以查看documentation了解更多详情。

Answer 3

此外，必须在 hoverNode 事件触发之前为交互设置悬停标志：

var options = {interaction:{hover:true}};

Answer 4

对我来说，它只需 3 个步骤

1.Fired 如果选项 interaction:{hover:true} 启用并且鼠标悬停在节点上。

  var options = { 
    physics: {
      enabled: false
    },
    interaction:
    {  hover:
        true
    }};

2.hoverNode函数

network.on("hoverNode", function (params) { network.canvas.body.container.style.cursor = 'pointer'; });

3.blurNode 函数

 network.on("blurNode", function (params) {
        network.canvas.body.container.style.cursor = 'default';
 });

Change mouse cursor over vis.js network node