Ищем алгоритм раскладки

Question

Я работаю с sigma.parsers.cypher.js плагин для Linkurious, который, по-видимому, размещает узлы в окне просмотра путем довольно невообразительного присвоения случайным значениям координат x и y, что при достаточном количестве узлов создает нечитаемый беспорядок - генерация графиков, встроенная в сервер Neo, делает работу намного лучше.

думая об этом, алгоритм, чтобы выложить вещи лучше, может работать так:

1. выберите первый узел на графике и поместите его в (0,0)
2. выберите все непосредственно связанные узлы и расположите их на {минимальном расстоянии} от родительского узла
3. если какие-либо два родных брата ближе, чем {минимальное расстояние}, увеличивайте расстояние от родителя, пока родные братья не могут быть достаточно разделены
4. для каждого брата выполните шаги 2 и 3 выше

но мне интересно, есть ли что-нибудь, что я мог бы использовать, чтобы мне не пришлось писать функциональность с нуля?

* Обновление I *

может быть 2) выбрать все (бездетные) непосредственно связанные узлы... и затем 2a) дочерние узлы с дочерними элементами должны быть расположены на двойном расстоянии + диаметр узла братьев и сестер (это дает место для его дочерних элементов)

* Обновление II *

если радиус окружности равен {минимальному расстоянию} и в нем больше бездетных узлов, чем уместится, мы можем либо: 1) увеличить радиус до тех пор, пока не уместятся все узлы, либо 2) создать второй слой

Answer 1

Так что для разметки графа многие люди используют либо силовую направленную разметку d3, либо какой-то измененный вариант. Я не уверен, использует ли браузер neo4j d3 или нет, но отображение графика там выглядит для меня как силовой вариант.

Визуализация графиков - это действительно глубокая тема, и есть много чего там. Чтобы увидеть примеры того, что возможно, просмотрите галерею d3.

РЕДАКТИРОВАТЬ, хотя я менее знаком с sigma.js, я думаю, что в Sigma Land эквивалентом является forceAtlas2.

Я не могу комментировать ваш конкретный алгоритм; Звучит так, как будто это может быть разумно, но для меня реальный вопрос заключается в том, "как вы используете семантику данных, с которыми имеете дело, для того, чтобы представить разумный макет"? Например, я имею дело с большим количеством временных графиков. Таким образом, мы используем макеты, ориентированные на силу, но вместо того, чтобы отображать вещи в концентрических кругах, с хорошо связанными элементами в центре и другими элементами, вытесненными наружу, мы стремимся размещать элементы слева направо вместе с временным аспектом данных. Это работает для нас, потому что мы знаем, каково свойство отметки времени во всех узлах, и мы знаем, что в этой области элемент времени чрезвычайно важен.

Если бы у вас были геоданные, то, возможно, силовая направленность была бы плохой идеей, и вы бы предпочли наносить на карту объекты. Если у вас есть данные социальных сетей, возможно, вы захотите разместить их в кластере вокруг "суперузлов", таких как Lady Gaga, чтобы показать, кто наиболее популярен в сети.

Смысл всего этого в том, что это зависит. Трудно сказать, насколько хороши ваши идеи визуализации без понимания семантики данных и основной области. Я считаю, что макеты, ориентированные на применение силы, являются разумным значением по умолчанию для начала, а затем настраиваются. Они на самом деле не настроены на какой-либо конкретный домен, что делает их вроде бы нормальными для большинства вещей, но на самом деле не очень хорошими для чего угодно.

Но суть в том, что есть куча фреймворков javascript, которые будут реализовывать дюжину различных алгоритмов для вас. Лучше всего начинать настройку с начальной точки d3 или аналогичной. Я бы вообще не рекомендовал реализовывать выбранный вами алгоритм самостоятельно, скорее сделайте это как набор настроек конфигурации для существующего механизма компоновки.