1. ホーム
  2. javascript

[解決済み] 純粋なJavaScriptのGraphvizと同等品 [終了しました]。

2022-05-15 05:34:41

質問

GraphViz が生成できる方向フロー図の純粋な、Javascript ベースの実装をご存知の方はいらっしゃいますか? 私は、きれいな視覚的な出力に興味があるのではなく、情報の木ではなくグラフを扱っているときに交差するエッジの数を最小限に抑えるように最適化されたベジエ線のレイアウトとともに、各ノードの最大の深さを把握するための計算に興味があるのです。 私はこのコードをブラウザ内で実行したいと思います。私は、拡張機能としてNodeサーバにGraphvizを簡単に埋め込むことができることを知っていますし、あるいは popen() でグラフ情報をストリームすることもできます。 .dot 形式でストリームオーバーします。

参考までに、典型的なGraphVizの出力を以下に示します。接続線がノード間を移動できるように、要素がどのように積み重ねられ、間隔が空けられているかに注意してください(非常に頻繁に交差したり、ノードを通過したりすることはありません)。

どのように解決するのですか?

この純粋な JavaScript による .dot canvas レンダラーの実装を見てみましょう。

http://ushiroad.com/jsviz/

このライブラリはドキュメント化されていません。作者は間違いなくもっと公表し、ドキュメント化すべきです(少なくともgithubにアップするよう彼に連絡します)。

更新 : コードは github にプッシュされました。 https://github.com/gyuque/livizjs

更新情報(2013/2/14) : 新たな候補が生まれました!このテーマに興味がある人は、ぜひViz.jsの サンプルページ github リポ .

更新情報(2020/7/16) : (7年後) http://webgraphviz.com/ も素晴らしい! :-)