elkjs icon indicating copy to clipboard operation
elkjs copied to clipboard

In layered hierarchical graph, spacing between nested nodes and node padding is not always applied.

Open alexei-tilikin opened this issue 2 years ago • 5 comments

Hi, I'm witnessing problems with spacing related layoutOptions on nested nodes. Using [email protected]

  1. The option elk.spacing.nodeNode is not always working for neighbor nodes inside a group. Couldn't figure out the logical condition to reproduce, but I have this demo graph. Seems like a specific combination of edges crossing hierarchy can reproduce this

Expecting here the horizontal spacing between node_1 and node_2 to be 150, as set on the parent node "group_1". Instead, it's the default spacing of 20.

  1. The layoutOption elk.padding is also sometimes ignored on group nodes. Specifically the top padding. Here

The top padding on both "group_1" and "group_2" is set to be 0. However, on group_1 it's the actual padding of 20. If I change the padding definition, the inner group_1 will keep adding 20 to whatever value is set in elk.padding. (in this simulator it's adding 21 but in my app, it was 20...)

Also, I have another "group inside group" case where the same problem reproduces for the outer group but not for the inner group. Here it also seems to be complex to reproduce. It's enough to remove some of the edges and the problem stops reproducing...

Any ideas? Could it be a side effect of the same bug somether in hierarchical layout?

alexei-tilikin avatar Mar 28 '22 15:03 alexei-tilikin

I found a workaround for the problem with elk.spacing.nodeNode. It happens to reproduce for neighbor nodes that have an edge passing between them. Defining elk.spacing.edgeNode as half of the value of elk.spacing.nodeNode can roughly estimate the desired spacing. However, if more edges are passing between the nodes, the spacing will increase, so it's not ideal...

alexei-tilikin avatar Mar 30 '22 06:03 alexei-tilikin

Not sure if it helps, but I could fix some layouting issues for sub flows / nested nodes by passing the options to the defaultLayoutingOptions.

This works for all nodes (including child nodes):

const elk = new ELK({
  defaultLayoutOptions: {
    'elk.padding': '[left=50, top=50, right=50, bottom=100]',
    'elk.spacing.nodeNode': '75.0',
    'elk.layered.spacing.nodeNodeBetweenLayers': '100.0',
  },
  workerUrl: '/elk-worker.min.js',
});

This doesn't work for child nodes:

const graph = {
  id: 'root',
  layoutOptions: {
    'elk.padding': '[left=50, top=50, right=50, bottom=100]',
    'elk.spacing.nodeNode': '75.0',
    'elk.layered.spacing.nodeNodeBetweenLayers': '100.0',
  }
  // ...
};

moklick avatar Mar 31 '22 11:03 moklick

@moklick , Thanks for the advice. I've been using the defaultLayoutOptions too. Specifically for the padding, the values are different for each group node in my case, so I'm setting this config on layoutOptions directly under the group node.

alexei-tilikin avatar Mar 31 '22 13:03 alexei-tilikin

Ahh :D I think I got it wrong.. The layout options only work for that specific level when you define it at the group node.

moklick avatar Mar 31 '22 13:03 moklick

It is a general problem and does not only effect nested nodes as seen in https://github.com/eclipse/elk/issues/846

soerendomroes avatar Jun 03 '22 07:06 soerendomroes