システムには何らかの入力があって、それが処理されて出力されます。処理は一段階に限らず、複数のステップを経ることもあります。さらに入力ソースが複数名こともあります。 そうした複雑なデータフローを表現するのに向いたライブラリがblocks.jsになります。

blocks.jsの使い方

メイン画面です。各ノードが線でつながっています。

ノードはドラッグできます。

メタデータの編集画面です。

線をつなぎ替えたり、ノードの削除もできます。

コンテクストメニューです。

blocks.jsを使うことでNode-Redのようなインタフェースであったり、Yahoo! Pipesのようなサービスを作ることもできるでしょう。汎用的なインタフェースなので、様々なデータフローをビジュアル化するのに使えるはずです。

blocks.jsはjQuery/JavaScript製のオープンソース・ソフトウェア(MIT License)です。

blocks.js demo Gregwar/blocks.js: JavaScript dataflow graph editor