Разместите узлы по кругу с помощью сигмы. js

Question

У меня есть сеть в древовидной структуре. Я хочу разместить узлы на одном уровне в форме круга. Таким образом, уровни можно визуализировать в виде центрированных c кругов.

Я хочу сделать это с помощью Sigma. js.

Предположим, я знаю уровень каждого узла. Тогда как выбрать координаты x и y для узлов.

Данные узлов и ребер находятся в файле json.

Answer 1

Существует пример, на котором график анимирует свои узлы от сетки до окружностей:
https://github.com/jacomyal/sigma.js/blob/master/examples/animate.html

for (i = 0; i < N; i++) {
  o = {
    id: 'n' + i,
    label: 'Node ' + i,
    circular_x: L * Math.cos(Math.PI * 2 * i / N - Math.PI / 2),
    circular_y: L * Math.sin(Math.PI * 2 * i / N - Math.PI / 2),
    circular_size: Math.random(),
    circular_color: '#' + (
      Math.floor(Math.random() * 16777215).toString(16) + '000000'
    ).substr(0, 6),
    grid_x: i % L,
    grid_y: Math.floor(i / L),
    grid_size: 1,
    grid_color: '#ccc'
};

Вам просто нужно определить x / y позиции ( смотрите Циркуляр_x и Ciruclar_y), которые размещают узлы в круге.

В таких библиотеках, как networkx, есть алгоритмы, которые помогут вам рассчитать эти позиции:
https://networkx.github.io/documentation/stable/auto_examples/drawing/plot_circular_tree.html

После того, как вы сгенерировали объект графа с помощью networkx (обычно G в документации), вы можете использовать одну из функций экспорта для извлечения данных основного графика (например, положения узлов): https://networkx.github.io/documentation/stable/reference/readwrite/index.html