Disable automatic select of node on click?

Question

I'm using a VIS.JS network diagram as a menu (of sorts) with a master/detail relationship to another area of the screen. Each time a user selects a node I signal the loading of the other area. Since the load is asynchronous and can take time (1-2 sec) I'd like to prevent the network node selection from changing until the details are loaded.

Ideally I'd like for the click to invoke the callback, without changing the node selection. Then receive a notification from the detail pane that the loading is complete, and only then change the node selection through code.

I think the only thing I'm missing is the ability to disable the auto-selection of a node when it is clicked.

Is that possible?

Thanks

-John

Answer 1

Capturing the event and preventing default behaviour should not focus the element.

handleClick (evt) {
  evt.preventDefault();
  // rest of code
}

Answer 2

I don't know if it'll exactly fit your need but, I needed to create some node unselectable so I prefix my unselectable node's id with a marker.

And then

  const unselectableMarker = 'header-';

  network.on('selectNode', (opts) => {
    network.setSelection({
      nodes: opts.nodes.filter(id => !id.startsWith(unselectableMarker)), // prevent selection of headers nodes
      edges: opts.edges,
    });
  });

I've found nothing in actual doc for preventing events in network context.