Left -> Right Tree Layout

[io7m]

Hello!

Is there a way to get tree layouts to be laid out left-to-right instead of top-to-bottom?

Something along the lines of:

https://graphviz.org/Gallery/directed/ninja.svg

[tomnelson]

Thanks for your interest!
There are 2 demos:

L2RTreeLayoutDemo
TidierL2RTreeLayoutDemo

The code that maps the layout L2R is this:

vv.getVisualizationModel()
    .getLayoutModel()
    .getLayoutStateChangeSupport()
    .addLayoutStateChangeListener(
        evt -> {
          if (!evt.active) {
            LayoutModel<String> layoutModel = evt.layoutModel;
            layoutModel
                .getLocations()
                .forEach(
                    (v, p) -> layoutModel.set(v, Point.of(p.y, layoutModel.getWidth() - p.x)));
          }
        });

If you want to go from right to left, like your example image, change it like this:
.forEach(
(v, p) -> layoutModel.set(v, Point.of(
layoutModel.getHeight() - p.y, p.x)));

[io7m]

Ah, thanks, I'll give it a try!

I've been unable to get any of the demo code to run as the latest Intellij IDEA seems to have serious problems opening the project. For whatever reason, it consistently manages to open the modules in a broken state.

[tomnelson]

I use Intellij IDEA for development, so I run the demos with it all the time.
I just downloaded the latest version (2022.3.2) and did not have any problems.

To test it everything, I did this:

git clone git@github.com:tomnelson/jungrapht-visualization.git
cd jungrapht-visualization
mvn clean install

After building it, I used File -> Open
and made a new project like this:

[io7m]

Following those exact steps, I get a project that has no Maven modules and no source directories configured:

It's possible to go through and manually set source directories, but notice that it also fails to include any Maven dependencies, and even the "Repair IDE..." option that takes me through a ton of steps to clear indices, reindex, etc, fails in the end.

I've not seen this happen with a Maven project before.

[io7m]

Checking to see if this is still the case on the latest version... ⌛

[tomnelson]

Mine looks like this, in the maven panel:

You might try invalidating the caches and loading the project again. I can't think of any other things to try.
I've never manually set source directories.

[io7m]

It appears it was a bug with the 2022.2.4 version. It imports fine with 2022.3.2. Sorry for the noise!

[tomnelson]

Glad you found a solution.
For what its worth, your question led me to think of a way to change the layout direction within the
jungrapht-layout module. I want the layouts to be independent of the visualization layer and any awt classes, so the layouts can be used with a different rendering system.

The layout algorithms can take an 'after' function (a Runnable) that runs when they are done.
I pushed some changes to the master branch. I think this approach is better.

[io7m]

I'm still working on this, although I've not been able to tune the code sufficiently to get the sort of output I'm looking for yet.

To clarify, I'm working on a patch editor for some audio effects hardware. The signal chain on the hardware is configured as a simple directed graph with a fixed number of possible branches. I wrote a very simple stack-based graph layout algorithm here:

https://github.com/io7m/gatwick/blob/develop/com.io7m.gatwick.gui/src/main/java/com/io7m/gatwick/gui/internal/preset/GWNodeArranger.java

This produces output like this:

This is fine, but there are occasionally graphs for which the algorithm breaks. Rather than try to exhaustively track down every last edge case, I thought it might be a better idea to look at a general purpose graph layout library. I've not yet been able to get jungrapht to produce graphs that are as compact, but I'll try to post some code when I have something concrete that gets most of the way there. 🙂

Edit: I do my own edge rendering, so I actually only need the vertex positions.

[tomnelson]

I don't have a layout algorithm that would produce that output. If I had an Orthogonal layout algorithm, it could be close, but you need to make some placement decisions based on the types of the endpoints.

This is the closest I could get, using the EiglspergerLayoutAlgorithm and rotating it:

[tomnelson]

If you want to see your graph with many different layouts, I pushed a demo called ShowLayoutsWithIO7MGraph to the master branch.