@vx/network

A simple package to represent a network graph.

Example Usage

import { Graph, DefaultLink, DefaultNode } from '@vx/network';
const nodes = [{ x: 50, y: 20 }, { x: 200, y: 300 }, { x: 300, y: 40 }];

const dataSample = {
  nodes,
  links: [
    { source: nodes[0], target: nodes[1] },
    { source: nodes[1], target: nodes[2] },
    { source: nodes[2], target: nodes[0] }
  ]
};

const MyGraph = () => (
  <Graph graph={dataSample} linkComponent={DefaultLink} nodeComponent={DefaultNode} />
);

Installation

npm install --save @vx/network

Components

API

# DefaultLink.link<object>

<DefaultNode />

<Graph />

# Graph.graph<object>

# Graph.linkComponent<any>
DefaultDefaultLink

# Graph.nodeComponent<any>
DefaultDefaultNode

# Links.className<string>

# Links.linkComponent<any>

# Links.links<array>

<Nodes />

# Nodes.className<string>

# Nodes.nodeComponent<any>

# Nodes.nodes<array>