kieler / klayjs

(deprecated) KIELER's layout algorithms for JavaScript

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Max graph width and node 'wrap'

robclouth opened this issue · comments

Is there a way to specify a maximum graph width, beyond which the nodes are wrapped so that they stay inside the bounds? Kind of like word wrap in text editors.

When you say width, do you refer to a left-to-right layout?

I mean a top to bottom layout. If nodes are on the same level, they are
positioned horizontally; I'm asking if there is an option to limit the
maximum horizontal width, and push any nodes that are outside that width
onto the next level.

On Thu, May 19, 2016 at 12:34 PM, Ulf Rüegg notifications@github.com
wrote:

When you say width, do you refer to a left-to-right layout?


You are receiving this because you authored the thread.
Reply to this email directly or view it on GitHub
#14 (comment)

So that they 'wrap' like the words do in text editors when the line is too
long.

On Thu, May 19, 2016 at 2:31 PM, Robert Clouth rob.clouth@gmail.com wrote:

I mean a top to bottom layout. If nodes are on the same level, they are
positioned horizontally; I'm asking if there is an option to limit the
maximum horizontal width, and push any nodes that are outside that width
onto the next level.

On Thu, May 19, 2016 at 12:34 PM, Ulf Rüegg notifications@github.com
wrote:

When you say width, do you refer to a left-to-right layout?


You are receiving this because you authored the thread.
Reply to this email directly or view it on GitHub
#14 (comment)

Sadly not. There are some solutions to this in the literature and we are working on features ourselves, but I cannot say if there will be something added in the near future.

Depending on the structure of your graph you may be able to work around the issue by introducing dummy edges for the layout only to force nodes to different layers.

Thanks. What generally makes the nodes go onto another level? The number of
edges?

On Thu, May 19, 2016 at 2:47 PM, Ulf Rüegg notifications@github.com wrote:

Sadly not. There are some solutions to this in the literature and we are
working on features ourselves, but I cannot say if there will be something
added in the near future.

Depending on the structure of your graph you may be able to work around
the issue by introducing dummy edges for the layout only to force nodes to
different layers.


You are receiving this because you authored the thread.
Reply to this email directly or view it on GitHub
#14 (comment)

Pairs of nodes connected by an edge must not be on the same level (also layer). There are different strategies that are explained in more detail in our wiki. See the section on Phase 2: Layering.

Hmmm ok. So potentially I could perform layout then if any node x position
is over the maximum width, connect it to another one on the same y with an
invisible dummy connection.

On Thu, May 19, 2016 at 3:51 PM, Ulf Rüegg notifications@github.com wrote:

Pairs of nodes connected by an edge must not be on the same level (also
layer). There are different strategies that are explained in more
detail in our wiki
https://rtsys.informatik.uni-kiel.de/confluence/display/KIELER/The+Five+Phases.
See the section on Phase 2: Layering.


You are receiving this because you authored the thread.
Reply to this email directly or view it on GitHub
#14 (comment)

For instance.

Max width would be useful for direction: 'RIGHT' as well... I'd like to have this graph "wrap" with window width:

As I resize the browser window, I'd like to pass in a maxWidth and relayout, and klay would decide the height.

Agree. For path-like graphs we already support such a wrapping and are working on something that would help your graph as well. I assume by wrapping with the window you mean that the flow should first return from the very right to the left-most position of the window?

commented

We have similar need for left-to-right graphs that are too long. Current behavior is to scale the graph so that complete graph is visible, but an option that 'wraps' graph would be great to have. However, one possible issue is how to handle nested groups. Below is a typical graph we are visualizing...

screen shot 2016-10-28 at 9 34 10 am copy

Thanks.

@sid-thakur thanks for the example. The nested nodes are indeed an interesting problem. I'll think about it.

In elkjs there are two options which address these use cases:

  • for top-down layout with restricted width the COFFMAN_GRAHAM layering strategy can be used alongside the layerBound option. Note however that only the number of real nodes can be restricted (i.e. edges are not considered).
  • for the left-right layout with restricted width the Graph Wrapping can be used.

I haven't thought about @sid-thakur's example yet but it seems to be rather challenging to me.