JavaScript网络可视化?

时间:2012-06-04 18:59:04

标签: javascript html5 visualization

我正在寻找一个可视化网络的库。

我只需要添加一些节点(节点上有文本),在它们之间添加边缘,(边缘被定向并在其上有文字)。我不想手动设置任何位置。

我希望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,他们都不满意我。

还有什么我可以尝试的吗?

6 个答案:

答案 0 :(得分:9)

查看VivaGraphJS VivaGraphJS的亚马逊可视化sample

布局配置sample,使用WebGL作为渲染器。

答案 1 :(得分:3)

我们制作mxGraph,但请注意,这是一个商业图书馆,不是开源的。我不确定为什么你列出的开源库失败了,但是确实形成了图形,设置几何和标签都是相当简单的函数调用。

答案 2 :(得分:2)

sigma.js有什么问题?图书馆的网站有一个非常简单的例子来绘制节点和边缘:

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();

答案 3 :(得分:2)

查看sigma.js的此页面 http://sigmajs.org/examples/a_plugin_example.html
你会看到它们是如何进行随机或圆形布局的。

答案 4 :(得分:2)

我发现这个javascript库很有帮助。查看网络示例页面:

visjs

答案 5 :(得分:0)

试试cne-tnetwork。它是javascript可视化库,用于创建和绘制网络图。它是基于SVG和HTML 5兼容的。它在github上公开,根据GNU Afferro许可证授权。您可以在库的readme中找到如何使用它。它有一个拖动节点的模式。节点之间的链接可以是单向的,双向的,甚至是连接多个元素的“总线”。使用CSS,您可以自定义所有样式(节点,链接,箭头,总线......)。