cylc / cylc-ui

Web app for monitoring and controlling Cylc workflows
https://cylc.github.io
GNU General Public License v3.0
37 stars 27 forks source link

graph: family collapsing #1130

Open oliver-sanders opened 2 years ago

oliver-sanders commented 2 years ago

Follow on from #1108

Implement family expand/collapse in the graph view.

In the Cylc 7 graph view families were represented with a special node shape & expansion was available via a right-click menu. When a family was expanded the special node was removed and the tasks it represented were added in its place.

With the Cylc 8 graph view we have more power over rendering so can do something more advanced. One thing I'd like to consider is expanding families into subgraphs so that the family name is preserved which should make graphs easier to understand.

Pull requests welcome!

oliver-sanders commented 1 year ago

Attempt along with https://github.com/cylc/cylc-ui/issues/1280

markgrahamdawson commented 7 months ago

For the time being - figure out a means of drawing a dotted box around families.

This can be done with graphviz subgraphs

The graphviz dot code is returned from the getDotCode function in Graph.vue view

Dot code can be rendered with dot foo.dot -Tpng -o foo.png

ultimately in the svg there will need to be a rect tag added... <rect x="" y="" width="" height="">

markgrahamdawson commented 6 months ago

When turning the dotcode into json objects - if two subgraphs are included with the exact same bounding box then the coordinate data is only contained in the first object

In the image below subgraph cluster_1 and subgraph cluster_2 have the same coordinates so they are not included in the object returned for cluster_2

image

Not sure if this is going to be an issue or not but thought it was worth making a note of.

I think its only really an issue if you wanted to do something along the lines of this... image

oliver-sanders commented 6 months ago

Some ideas for a unified approach to grouping/collapsing cycles/families. I'm suggesting unifying the handling of cycles and families (note, cycles represent the "root" family so they are essentially the same thing).

Grouping/Ungrouping - Drawing dashed boxes around a cycle/family.

Collapsing/Expanding - Reducing a family down to a single node.

Limitations of the Cylc 7 approach:

Note, for simplicity, this approach groups/collapses all instances of selected families rather than managing this at a per-cycle level. I think this is probably more aligned with expectations, but does represent a minor limitation, e.g. there's no ability to collapse all but one cycle. The ability to expand/collapse specific cycle instances would be a reasonable enhancement.

Design Sketch

graph-grouping-and-collapsing


Had a quick discussion on this (more to come):