在Cytoscape.js中使用dagre布局时如何处理多树情况

Question

我是Cytoscape.js的新手，并尝试根据用户的搜索输入在Dagre布局的帮助下绘制图形。节点数通常为50-100。

尽管Dagre适用于单个树，但当图形包含多个树（有时包含独立节点）时，这些树的根将自动水平排列（如图所示），这使得节点和标签变得非常小。如果我们可以利用水平空间，图表肯定会更清晰。

我的问题是我们如何处理多树情况，垂直排列树木（例如，一行中有4根，其他可以安排在这些树下）以充分利用布局空间。

Answer 1

查看布局方向的rankDir选项：http://js.cytoscape.org/#layouts/dagre

要获得更多控制权，请尝试为每个子图/树运行一个布局：http://js.cytoscape.org/#collection/layout

您可以使用boundingBox为每个子图控制子图位置。

有关配置选项的详细信息，请参阅Dagre文档：https://github.com/cpettitt/dagre/wiki