In vis-network, how is horizontal order determined in hierarchical layout?

Question

In this example, "level" is used to control the vertical position a node is put at (assuming hierarchical.direction is up-down).

However, I didn't find how to set the horizontal order for nodes on the same hierarchy. For example, if I want to put node 6 in front of node 1, is there a way to do it?

My understanding is that the horizontal order is purely determined by node insertion order, is it correct?

Coeliac

Answer 1

According to https://github.com/visjs/vis-network/issues/926, the order is non-deterministic. Quote:

Q: I didn't find how to set the horizontal order for nodes on the same hierarchy. For example, if I want to put node 6 in front of node 1, is there a way to do it?

A: As far as the public API goes: No, the order is not guaranteed in any way, do not rely on it, it may change with any new release or between browsers.

Q: My understanding is that the horizontal order is purely determined by node insertion order, is it correct?

A: As far as the CURRENT implementation and decent browsers go: Yes.

Coeliac

I understand it's not supported with public API. Is there any custom way to change data nodes manipulated by expecting its position outside and set it back, ideally not resetting all nodes, but children nodes only? – Mellman

Answer 2

Just want to add that if you're generating nodes and edges dynamically via user interactions and want to ensure the nodes and edges are ordered correctly, here's the way to do it:

After the user interaction, clear the nodes and edges first via the clear method, then use add to add the newest nodes and edges by the desired insertion order.

Kop