В сети vis.js, как автоматически установить уровень узла на основе его глубины? - PullRequest
Новая
       32

В сети vis.js, как автоматически установить уровень узла на основе его глубины?

0 голосов
/ 14 мая 2019

Я пытаюсь создать иерархический график, используя vis.js.Я могу создать иерархический график, но компоновка - это не то, что я ищу: узлы находятся на казалось бы произвольных уровнях.Я хочу, чтобы узлы находились на разных уровнях в зависимости от количества ребер между ними и корнем.

Данные изначально получены из SQL.В настоящее время у меня есть скрипт Python, который обрабатывает данные на языке DOT (и я могу отображать график с макетом, который я хочу, используя Graphviz), поэтому я использую метод .convertDot.Я мог бы повторно обработать сеть после импорта в vis.js и добавить правильный атрибут «level» для каждого узла по отдельности, но должен быть лучший способ.

Вот полный документ HTML / JS, который ядо сих пор: 

<!DOCTYPE HTML>
<html>
<head>
  <script src="./vis/dist/vis.js"></script>
  <link href="./vis/dist/vis.css" rel="stylesheet" type="text/css" />
</head>

<body>
<div id="graph", style="height: 1000px"></div> 

  <script> 
    // provide data in the DOT language
    var DOTstring = 'digraph {"13332500" -> "13483400" "13567500" -> "13483400" "10037901" -> "10037902" "10037902" -> "13483400" "15038400" -> "13455700" "13455700" -> "13455702" "13455702" -> "13483400" "13567300" -> "13483400" "11890500" -> "13483400" "13483400" -> "13554900"}';
    var parsedData = vis.network.convertDot(DOTstring);

    var data = {
      nodes: parsedData.nodes,
      edges: parsedData.edges
    }

    var container = document.getElementById('graph');
    var options = parsedData.options;

    // you can extend the options like a normal JSON variable:
    options.layout = {
      "hierarchical": true
    }

    // create a network
    var network = new vis.Network(container, data, options);
  </script>

</body>
</html>

Вот то, что код будет производить: a graph made by vis.js И вот макет, который я ищу, как произведено graphviz: a graph made by graphviz

Если вам интересно, почему я пытаюсь сделать это в vis.js, когда он уже работает в Graphviz: причина в том, что я хочу сделать его интерактивным.

1 Ответ

0 голосов
/ 15 мая 2019

Полагаю, вы не изучали другую документацию. введите описание ссылки здесь

введите описание ссылки здесь

Надеюсь, что приведенная выше ссылка поможет вам получить все необходимые настройки.

...