Simple-graph-ui NPM

💫 Simple Graph UI

A simple React component library to create directed/undirected graph for visualization

👇 Installation

npm i simple-graph-ui

🌐 Components

`Canvas` (Must have)

A layout wrapper for the graph

`Node`

Create a node with the text label inside with custom x,y coordinates and edges

props	type	required	description
label	string	true	Label of the node
x	number	true	x position of the node
y	number	true	y position of the node
neighbor	string	false	Neighbor of the node (currently have one only)

😎 Basic usage

import { Node, Canvas } from 'simple-graph-ui';
<Canvas>
  <Node label={'A'} x={75} y={75} neighbor="B"/>
  <Node label={'B'} x={600} y={85} neighbor="A"/>
  <Node label={'C'} x={600} y={500} neighbor="B"/>
</Canvas>