About relation-graph

• The relation-graph is a relationship data display component that supports Vue 2, Vue 3, and React. It enables users to fully customize graphical elements using “common HTML elements, Vue components, React components” through slots, and provides practical API interfaces to facilitate the development of interactive graphical applications."
• In addition to the typical relationship data display functionality, the relation-graph also supports being used as a drawing board. You can place any content on the drawing board, simply by setting an id for the elements you want to connect, and defining “element lines.” This allows for the easy creation of a drawing board that supports the creation of arbitrary connections, zooming and dragging, and dynamic interactions through the API. Read More: Use relation-graph as a Drawing Board
• relation-graph also provides UI components for editing graphic elements, these components are rich and flexible, allowing you to quickly build workflow editors, mind map editors, and other relationship graph applications. Read More: Example of a graphic editing suite

Docs & Examples

• Docs : https://relation-graph.com/#/docs
• Examples :https://relation-graph.com/#/demo

The website above includes documentation, online demos, and a visual configuration tool for software developers.

Github

Github：https://github.com/seeksdream/relation-graph

The complete, runnable project examples:.

• A complete, runnable Vue2 project example:. https://github.com/seeksdream/relation-graph-vue2-demo
• A complete, runnable Vue3 project example(Typescript):. https://github.com/seeksdream/relation-graph-vue3-demo
• A complete, runnable React project example(Typescript):. https://github.com/seeksdream/relation-graph-react-demo