flow-view

Visual editor for Dataflow programming

Installation

Using npm

With npm do

npm install flow-view

Using a CDN

Try this in your HTML page

<script type="importmap">
  { "imports": { "flow-view": "https://unpkg.com/flow-view" } }
</script>

<style>
  .container {
    max-width: 100%;
    height: 400px;
  }
</style>

<div class="container"></div>

<script type="module">
  import { FlowView } from 'flow-view';

  const container = document.querySelector('.container');
  const flowView = FlowView.instance(container);
  flowView.load({
    nodes: {
      id1: { text: 'Hello World', x: 10, y: 10 }
    },
    links: {}
  });
</script>

[!WARNING] Be aware that there is no minified bundle, so you probably do not want to use the CDN in production. Your bundler (e.g. esbuild, Vite, rollup, etc.) will take care of minification and transpiling according to your target browsers.

Usage

See documentation and examples.

License

MIT