Библиотека визуализации графов в React

у нас есть набор данных, который представляет собой направленный граф. В настоящее время мы показываем эти данные в сетке (Слик сетки) в UI, что-то вроде ниже.

Parent Nodes of Selected Node:
------------------------------
Selected Node
-- Parent Node1
-- Parent Node2
-- Parent Node3
.
.

Child Nodes of Selected Node:
-----------------------------
Selected Node
-- Child Node1
-- Child Node2
-- Child Node3
.
.

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

есть ли некоторые библиотеки, похожие/лучше, чем https://www.npmjs.com/package/react-graph-vis в реагирует который может помочь мне создать визуализацию графика зависимостей? Любые зацепки здесь действительно ценятся.

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

примечание: Я не ищу библиотеку диаграмм.

3 ответов


требование вы упомянули 1. Allows the user to interact with the graph. 2. Light weight. 3. Can scale to show 1000's of nodes. 4. Should be able to zoom in and zoom out.

Я думаю https://www.npmjs.com/package/react-graph-vis может сделать трюк.

единственное, что вам нужно сделать, это написать сценарий для преобразования формата данных в react-graph-vis формат API-интерфейс.

но если это не то, что вам нужно, я могу вставить какую-то библиотеку графа вы.

обновление

существует РЕПО, связанное с реакцией:


Если вы еще не пробовали, вы должны попробовать d3.js. С его помощью можно сделать практически любую визуализацию данных.

вот несколько примеров я уверен, что вы можете найти то, что вам нравится. https://github.com/d3/d3/wiki/gallery


еще один вариант https://github.com/antvis/g6 Решение от AntV