6

ネットワークを視覚化するためのライブラリを探しています。

いくつかのノードを追加し(ノードにはテキストがあります)、それらの間にエッジを追加する必要があります(エッジは方向付けられ、テキストがあります)。手動で何かの位置を設定したくありません。

APIは次のように単純にしたいと思います。

var node1 = X.addNode(1, "Hello"),
    node2 = X.addNode(2, "World");
X.addEdge(node1, node2, "helloworld");

私は何時間も検索し、arborjs、sigma.js、d3.js、JavaScript InfoVis Toolkitの世話をしましたが、どれも私を満足させませんでした。

他に試すことができるものはありますか?

4

6 に答える 6

9

VivaGraphJSをチェックしてください。
VivaGraphJSによるAmazonVisualizationサンプル

レイアウト構成サンプルは、レンダラーとしてWebGLを使用します。

于 2012-06-04T19:03:23.283 に答える
3

mxGraphを作成していますが、これは商用ライブラリであり、オープンソースではないことに注意してください。リストしたオープンソースライブラリが失敗した理由は正確にはわかりませんが、グラフの作成、ジオメトリとラベルの設定はすべて、かなり簡単な関数呼び出しです。

于 2013-03-25T20:47:09.393 に答える
2

sigma.jsの何が問題になっていますか?ライブラリのWebサイトには、ノードとエッジを描画するための非常に簡単な例があります。

var sigRoot = document.getElementById('sig');
var sigInst = sigma.init(sigRoot);
sigInst.addNode('hello',{
label: 'Hello',
color: '#ff0000'
}).addNode('world',{
label: 'World !',
color: '#00ff00'
}).addEdge('hello_world','hello','world').draw();
于 2012-06-27T10:58:04.840 に答える
2

sigma.js
http://sigmajs.org/examples/a_plugin_example.html
のこのページを確認 すると、ランダムまたは円形のレイアウトがどのように行われるかがわかります。

于 2012-07-10T11:44:47.773 に答える
2

このjavascriptライブラリが役立つことがわかりました。ネットワークの例のページを確認してください。

visjs

于 2015-08-04T14:08:25.997 に答える
0

cne-tnetworkを試してみてください。ネットワークグラフを作成および描画するためのJavaScript視覚化ライブラリです。これはSVGベースでHTML5と互換性があります。これはgithubで公開されており、GNUAfferroライセンスの下でライセンスされています。ライブラリのreadmeで使用方法を見つけることができます。ノードをドラッグするモードがあります。ノード間のリンクは、単方向、双方向、または複数の要素を接続する「バス」にすることができます。CSSを使用すると、すべてのスタイル(ノード、リンク、矢印、バスなど)をカスタマイズできます。

于 2014-02-26T16:24:08.737 に答える