Как правильно подойти к вопросу: переход по ссылке с параметром на конкретный узел в vis.js?

В vis.js переход по ссылке с параметром на конкретный узел делается через чтение параметра из URL и вызов методов network после инициализации графа. Обычно нужно найти node id, сфокусировать его, выделить и при необходимости открыть карточку/tooltip.

Пример URL:

/graph.html?node=123

JavaScript:

const params = new URLSearchParams(window.location.search);
const nodeId = params.get('node');
 
network.once('afterDrawing', function () {
  if (!nodeId) return;
 
  network.selectNodes([nodeId]);
  network.focus(nodeId, {
    scale: 1.2,
    animation: {
      duration: 600,
      easingFunction: 'easeInOutQuad'
    }
  });
});

Важно, чтобы id в URL совпадал с id узла в данных. Если у вас числовые ID, а из URL приходит строка, приведите тип:

const nodeId = Number(params.get('node'));

Если данные графа подгружаются асинхронно, фокус нужно делать после загрузки nodes/edges и создания network. Иначе метод выполнится раньше, чем узел появится.

Для удобства можно обновлять URL при клике по узлу:

network.on('selectNode', function (event) {
  const id = event.nodes[0];
  const url = new URL(window.location.href);
  url.searchParams.set('node', id);
  history.replaceState(null, '', url);
});

Если узлов много и они подгружаются с сервера, добавьте отдельную проверку: если нужного id ещё нет в dataset, сначала загрузите нужный фрагмент графа, а уже потом вызывайте focus. Иначе код будет корректный, но визуально ничего не произойдёт.

Для удобства пользователя можно дополнительно подсветить выбранный узел через группу, цвет или временное изменение стиля. Только не забывайте возвращать стиль обратно при выборе другого узла, чтобы граф не превращался в набор “вечных” подсветок.

Итог: передавайте id узла в query string, после готовности графа вызывайте selectNodes и focus. Если не работает, проверьте тип id, момент инициализации, наличие узла в dataset и то, загружены ли данные до вызова фокуса.