SVG custom elements for FBP graph editing and visualization. Used in noflo/noflo-ui
Latest commit 9cfa3c1 Dec 13, 2018

The Graph Editor Build Status MIT license

This project provides a set React components for viewing and editing node-based graphs. The focus is on graphs used for dataflow and Flow-based programming.

The graph structure is stored by fbp-graph, which supports extendable metadata and undo/redo.

You can optionally use klayjs-noflo for automatic layout of graphs.

the-graph is used as the editor in the Flowhub IDE.



Install via NPM

npm install the-graph

See the examples for how to include the .js and .css files, and API usage.


The MIT License


Flowhub logo

the-graph is a part of Flowhub, a platform for building robust IoT systems and web services.
We offer an Integrated Development Environment and consulting services.


Clone the repo

git clone # or your own fork on Github
cd the-graph

Run tests, watch for changes

npm start

Open http://localhost:3000/spec/runner.html for the automated tests, or http://localhost:3000/examples/demo-full.html for interactive demo.

Send pull requests on Github!