a super simple, no-nonsense diagramming library written in react that just works
Docs are currently being worked on, along with a migration path.
A flow & process orientated diagramming library inspired by Blender, Labview and Unreal engine.
Example implementation using custom models: (Dylan's personal code)
Get started with the default models right out of the box:
For all the bells and whistles:
yarn add @projectstorm/react-diagrams
This includes all the packages listed below (and works (mostly and conceptually) like it used to in version 5.0)
This library now has a more modular design and you can import just the core (contains no default factories or routing)
yarn add @projectstorm/react-diagrams-core
this is built ontop of the evolving react-canvas-core library
yarn add @projectstorm/react-canvas-core
which makes use of
yarn add @projectstorm/geometry
and of course, you can add some extras:
yarn add @projectstorm/react-diagrams-defaults yarn add @projectstorm/react-diagrams-routing
Before running any of the examples, please run
yarn buildin the root. This project is a monorepo, and the packages (including the demos) require the packages to first be built.
Take a look at the diagram demos
Take a look at the demo project which contains an example for ES6 as well as Typescript
yarn installyou must then run:
cd packages/diagrams-demo-gallery && yarn run start
yarn build:prodin the root directory and it will spit out the transpiled code and typescript definitions into the dist directory as a single file.
Do you have an interesting project built with react-diagrams? PR it into this section for others to see.