我们目前正在构建一个Web 应用程序 (AngularJS),它需要根据动态创建的数据绘制有向无环图(最多 1000 个节点,最多 10000 条边)。
一年多以来,我一直在寻找一个库/工具,它正在计算所需的布局并绘制一个可以设置样式、缩放和平移、交互式的图形(例如,在鼠标悬停时突出显示孩子)。
Graphviz是产生最佳结果的工具,但它还没有真正准备好在网络服务器上使用(特别是因为我不能保证操作系统并且不想这样做)。
我尝试了 dagre,它是d3 渲染——我非常喜欢它,但它有两个主要缺点:1)它并不真正支持排名和聚类——这使得输出相当混乱;2)随着图表越来越大,它的性能越来越不能接受。
接下来真正令人信服的是cytoscape.js,因为输出看起来非常好,而且绘制更大的图表也相当快(并允许进行一些性能调整)。但它的标准布局(例如 cose 或广度优先)不会产生我们需要的输出。
从我目前的角度来看,有两个机会:
1) 使用 dagre.js 创建布局并使用cytoscape.js绘制结果(布局:'preset',使用来自 dagre 布局的节点计算的 x 和 y)。但是这种方式不支持“化合物”/集群。
2) 使用[viz.js] ( https://github.com/mdaines/viz.js)(Graphviz的脚本化 Javascript 版本,在绘制图形方面表现不佳)将结果计算为普通的输出格式和再次使用此结果用cytoscape.js绘制它。
现在我的问题:
1)你有另一个想法如何实现它?
2)如果我的想法是正确的,你能给我任何关于如何理想地链接链条的提示吗?
(AngularJS -> REST 后端 -> JSON 到前端 -> 为 dagre 或 viz 重构 JSON -> 计算布局 -> 输入结果到 cytoscape -> 在浏览器中渲染?!?)并且有机会在我的node.js 前端服务器而不是客户端本身(再次由于性能)?
任何提示和想法都会受到高度赞赏。