JSで要素間を線で繋いだり動かしたりライブラリ調査@202002

JSでオブジェクト間に線を引きたい調査メモ

ライブラリ名	GitHub	サンプル
diagramflowjs	https://github.com/luisalvesmartins/diagramflowjs	https://lambot.blob.core.windows.net/github/diagramflowjs/index.html
SimpleFlowchart	https://github.com/mmazo/SimpleFlowchart	http://mmazo.de/flowchart/
svg.connectable.js	https://github.com/jillix/svg.connectable.js	http://jillix.github.io/svg.connectable.js/
svg.draggy.js	https://github.com/jillix/svg.draggy.js	http://jillix.github.io/svg.draggy.js/
leader-line	https://github.com/anseki/leader-line	https://anseki.github.io/leader-line/
Drawflow	https://github.com/jerosoler/Drawflow	https://jerosoler.github.io/Drawflow/
Flowy	https://github.com/alyssaxuu/flowy	https://alyssax.com/x/flowy/

###diagramflowjs

削除や追加、リネームなど機能が豊富な感じで実用向けな感じ

###SimpleFlowchart

バインバイン動く

###svg.connectable.js

ソースコードなどが合って使いやすい

###svg.draggy.js

SVGドラック簡単に追加できて便利

###leader-line

結構いろんな線があるのでウェブで線を引きたいときには使いたい感じ

###Drawflow(202009追加)

NodeRedみたいな感じで使えそうなので便利化なる

###Flowy(202106追加)

自分でオブジェクト同士の線引きはできないが、処理フロー可視化としては使えそう