OSSでソースコードも公開されているJavaScript製のシンプルで使いやすいフローチャート作成Webアプリ・「Drawflow」

Ads

Drawflow


DrawflowはJavaScript製のシンプルで使いやすいフローチャート作成Webアプリです。オープンソースとしてソースコードも公開されています。他ライブラリへの依存もありません。

左ペインにあらかじめ用意された項目をドラッグでチャートエリアに持っていき、チャートを作成していく、というシンプルな流れ。

項目はHTMLで生成されており、チャートエリアへ移動後に展開されるオブジェクトはJavaScriptで制御されています。

 case 'telegram':
          var telegrambot = `
          <div>
            <div class="title-box"><i class="fab fa-telegram-plane"></i> Telegram bot</div>
            <div class="box">
              <p>Send to telegram</p>
              <p>select channel</p>
              <select df-channel>
                <option value="channel_1">Channel 1</option>
                <option value="channel_2">Channel 2</option>
                <option value="channel_3">Channel 3</option>
                <option value="channel_4">Channel 4</option>
              </select>
            </div>
          </div>
          `;
          editor.addNode('telegram', 1, 0, pos_x, pos_y, 'telegram', { "channel": 'channel_3'}, telegrambot );
          break;

項目がそう多くないチャートツールには最適かもしれませんね。ライセンスはMITとの事です。

Drawflow