2

I'm new to Cytoscape.js and trying to draw a graph with the help of Dagre layout depending on users' search input. Number of nodes is typically 50-100.

Although Dagre works well for a single tree, when the graph contains several trees (and sometimes includes independent nodes), the roots of these trees are automatically arranged horizontally(as the picture shown), which makes the nodes and labels become very small. If we can take advantage the horizontal space, the graph will be surely clearer.

enter image description here

My question is that how we can deal with multiple-tree situation, to vertically arrange the trees (for example, 4 roots in a line and the others can be arranged under these trees) to fully utilize the layout space.

yetisun
  • 121
  • 2
  • 5
  • Well, once the layout is ready, is it possible to use the position results of dagre layout and recalculate each node's position? – yetisun Aug 17 '15 at 02:41
  • 1
    I have a silly question: any reason not to simple create one graph per root? – StackExchange What The Heck Aug 17 '15 at 16:01
  • Well, the "tree" I mentioned in my question is not the typical tree like structure. They are compound nodes. There are also edges between "trees"(I added a photo to better explain this). In this case, I'm not sure whether multiple layouts can solve this? How to deal with the edges between different "trees"? – yetisun Aug 18 '15 at 01:43

1 Answers1

0

Take a look at the rankDir option for orientation of the layout : http://js.cytoscape.org/#layouts/dagre

For even more control, try running one layout per subgraph/tree: http://js.cytoscape.org/#collection/layout

You can control the subgraph position using the boundingBox for each subgraph.

Also see the Dagre docs for details on the config options : https://github.com/cpettitt/dagre/wiki

maxkfranz
  • 11,896
  • 1
  • 27
  • 36
  • Thx, @maxkfranz. As my reply to yochannah, I've added a picture to better explain the problem i ran into. In fact, I want to put the compound nodes horizontally when too many large compound nodes (with lots of children) exist. Dagre with default setting produces a result of horizontal organization of the nodes. I don't know whether the subgraph idea can deal with the edges across compound nodes? – yetisun Aug 18 '15 at 01:54