structurizr / dsl

Structurizr DSL
https://docs.structurizr.com/dsl
Apache License 2.0
1.41k stars 265 forks source link

Strange layout with relations between grouped components #258

Closed activey closed 1 year ago

activey commented 1 year ago

Description

Hi,

I'm having some strange layout issues when using relations between components put in distinct groups. I'm attaching a workspace DSL file and the result diagram screenshot.

Please have a look how the layout behavior changes when mentioned problematic components relation is removed (for that just comment out/remove this relation: Service2 -> Service1).

Ideally I would expect nicely distributed components but for some reason they stick to the right :/

Many thanks for any comments in this matter.

Steps to reproduce

  1. Use provided DSL code,
  2. Remove Service2 -> Service1 relation to see the expected layout

Screenshot

image

Code sample

workspace {

    model {
        properties {
            "structurizr.groupSeparator" "/"
        }

        user = person "User"

        softwareSystem "Software System" {

            nginx = container "API Gateway" "NGNIX" {
                tags "API Gateway"
            }

            firstDatabase = container "First database" "PostgreSQL" {
                tags Database
            }

            secondDatabase = container "Second database" "PostgreSQL" {
                tags Database
            }

            serviceContainer = container "Test service" "" "" {
               group "group1" {
                  Service1 = component "Service1" {
                  }

                  Controller1 = component "Controller1" {
                  }

                  Repository1 = component "Repository1" {
                  }

                  Repository2 = component "Repository2" {
                  }

               }

               group "group2" {
                  Service2 = component "Service2" {
                  }

                  Controller2 = component "Controller2" {
                  }

                  Repository3 = component "Repository3" {
                  }

                  Repository4 = component "Repository4" {
                  }

                  Repository5 = component "Repository5" {
                  }

                  Repository6 = component "Repository6" {
                  }

                  Repository7 = component "Repository7" {
                  }

                  Repository8 = component "Repository8" {
                  }

                  Repository9 = component "Repository9" {
                  }
               }

            }

            Controller1 -> Service1
            Service1 -> Repository1
            Service1 -> Repository2
            Repository1 -> firstDatabase
            Repository2 -> firstDatabase

            Controller2 -> Service2
            Service2 -> Repository3
            Service2 -> Repository4
            Service2 -> Repository5
            Service2 -> Repository6
            Service2 -> Repository7
            Service2 -> Repository8
            Service2 -> Repository9

            Repository3 -> secondDatabase
            Repository4 -> secondDatabase
            Repository5 -> secondDatabase
            Repository6 -> secondDatabase
            Repository7 -> secondDatabase
            Repository8 -> secondDatabase
            Repository9 -> secondDatabase

            nginx -> Controller1
            nginx -> Controller2

            # problem lays here
            Service2 -> Service1

        }

        user -> nginx "Calls"
    }
}

Configuration

No response

Severity

Minor

Priority

Low

Resolution

I'm willing to sponsor/donate to this fix (add details below)

More information

No response

activey commented 1 year ago

Just noticed it behaves pretty much the same when groups are removed.

simonbrowndotje commented 1 year ago

It's just a quirk of how Graphviz is organising elements; the same happens for the PlantUML export.

image

You might want to use manual layout instead.