Change mouse cursor over vis.js network node

Question

Is there a way to change the mouse cursor in vis.js when it's over a network node? I'm looking to treat them as links to the object the node represents and have been asked that the cursor change to the "finger" icon to indicate it can be clicked.

Answer 1

for me its work with 3 steps

1.Fired if the option interaction:{hover:true} is enabled and the mouse hovers over a node.

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

2.hoverNode Function

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

3.blurNode Function

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

Answer 2

For that purpose, first we attach hoverNode event of network that fires when we hover on any node of network.

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

Then we bind blurNode event of network that fires when we bring house away (blur) from node. If we don't attach this event, you will see pointer on all over your network.

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

you can see documentation for further details.

Answer 3

Additionally, the hover flag must be set for interactions before the hoverNode event will fire:

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