The Wayback Machine - https://web.archive.org/web/20190420164709/https://github.com/projectstorm/react-diagrams
Skip to content
a super simple, no-nonsense diagramming library written in react that just works
Branch: master
Clone or download
dylanvorster Merge pull request #178 from smeijer/feature/add-position-changed-event
feat(events): add `positionChanged` event to `NodeModel`
Latest commit a950106 Feb 28, 2019
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
.circleci properly handle tests on CI Feb 24, 2018
.github a few more updates Jan 7, 2018
.storybook lol May 5, 2018
demos Ran prettier Nov 30, 2018
docs --fix: Typo. Oct 31, 2018
images upgrade images Mar 17, 2018
src Merge pull request #178 from smeijer/feature/add-position-changed-event Feb 28, 2019
tests Fixed up storybook snapshot Dec 1, 2018
.editorconfig started a relatively large overhaul of the project Jul 25, 2017
.envrc
.gitignore Added @types directory to the .gitignore file Apr 1, 2018
.npmignore general improvements Mar 17, 2018
.yarnrc bump all the things, fix small issue May 5, 2018
CHANGELOG.md update changelog May 5, 2018
CONTRIBUTING.md
LICENSE added license file Jun 13, 2016
README.md Actually fix it this time lol Aug 1, 2018
SUMMARY.md Updates docs/Getting Started.md Mar 17, 2018
about-the-project.md Updates docs/Getting Started.md Mar 17, 2018
jest.config.js
package.json 5.2.1 May 5, 2018
tsconfig.json
tslint.json clean refactor / consistent TSLint / Prettier Mar 2, 2018
webpack.config.js Hotfix Mar 21, 2018
yarn.lock bump all the things, fix small issue May 5, 2018

README.md

STORM React Diagrams

PSA: React Diagrams is currently getting a bit of a rewrite to enable much more advanced features. To see the new foundation WIP visit https://github.com/projectstorm/react-canvas.


DEMO: http://projectstorm.cloud/react-diagrams

DOCS: https://projectstorm.gitbooks.io/react-diagrams

RELEASE NOTES : http://dylanv.blog/2018/03/03/storm-react-diagrams-5-0-0/

A super simple, no-nonsense diagramming library written in React that just works.

Join the chat at https://gitter.im/projectstorm/react-diagrams NPM NPM Package Quality CircleCI

Example implementation using custom models: Personal Project Get started with the default models right out of the box:

Introduction

A no-nonsense diagramming library written entirely in React with the help of a few small libraries. It aims to be:

  • Simple, and void of any fuss/complications when implementing it into your own application
  • Customizable without having to hack the core (adapters/factories etc..)
  • Simple to operate and understand without sugar and magic
  • Fast and optimized to handle large diagrams with hundreds of nodes/links
  • Super easy to use, and should work as you expect it to
  • Perfect for creating declarative systems such as programmatic pipelines and visual programming languages

Run the demos

After running yarn install you must then run: yarn run storybook

Building from source

Simply run webpack in the root directory (or export NODE_ENV=production && webpack if you want a production build) and it will spit out the transpiled code and typescript definitions into the dist directory as a single file.
We use webpack for this because TSC cannot compile a single UMD file (TSC can currently only output multiple UMD files).

Checkout the docs

You can’t perform that action at this time.