Collapsed symbols on diagram.

[cpgonz2]

Hi, I am having some issues when doing npx cdk-dia. The AWS resources appear like collapsed as you can see:

I thought it was because of dependencies but I don't know why this is happening. Thanks!

[pistazie]

Strange.

• In addition to the diagram.png cdk-dia created a diagram.dot file. would you mind posting it here?
• How did you install Graphviz and which OS do you run on?

[cpgonz2]

digraph "Diagram" { splines = "ortho"; pad = "1.0"; nodesep = "0.60"; ranksep = "0.75"; fontname = "Sans-Serif"; fontsize = "15"; dpi = "200"; rankdir = "BT"; compound = "true"; fontcolor = "#222222"; edge [ color = "#D5871488", penwidth = 2, arrowhead = "dot", arrowtail = "dot", ]; node [ shape = "box", style = "rounded", fixedsize = true, width = 1.7, height = 1.7, labelloc = "c", imagescale = true, fontname = "Sans-Serif", fontsize = 8, margin = 8, ]; subgraph "AwsCdkBackstageAuroraTsStack" { subgraph "cluster-SubGraph.AwsCdkBackstageAuroraTsStack" { graph [ label = "AwsCdkBackstageAuroraTsStack", labelloc = "b", labeljust = "l", margin = "10", fontsize = "16", penwidth = "2", pencolor = "#888888", style = "filled,rounded", fillcolor = "#e4e4e4", ]; "AwsCdkBackstageAuroraTsStack/Secret" [ label = " Secret", fontsize = 12, image = "/home/ec2-user/environment/aws-cdk-backstage-aurora/node_modules/cdk-dia/icons/aws/Service/Arch_Security-Identity-Compliance/64/Arch_AWS-Secrets-Manager_64@5x.png", imagescale = "true", imagepos = "tc", penwidth = "0", shape = "node", fixedsize = "true", labelloc = "b", width = 1.2, height = 1.466, ]; "AwsCdkBackstageAuroraTsStack/ecs-vpc-1" [ label = " ecs-vpc-1", fontsize = 12, image = "/home/ec2-user/environment/aws-cdk-backstage-aurora/node_modules/cdk-dia/icons/aws/Service/Arch_Networking-Content/64/Arch_Amazon-Virtual-Private-Cloud_64@5x.png", imagescale = "true", imagepos = "tc", penwidth = "0", shape = "node", fixedsize = "true", labelloc = "b", width = 2, height = 2.266, ]; "AwsCdkBackstageAuroraTsStack/fargate-sg" [ label = " fargate-sg", fontsize = 12, image = "/home/ec2-user/environment/aws-cdk-backstage-aurora/node_modules/cdk-dia/icons/aws/security_group.png", imagescale = "true", imagepos = "tc", penwidth = "0", shape = "node", fixedsize = "true", labelloc = "b", width = 2, height = 2.266, ]; "AwsCdkBackstageAuroraTsStack/aurora-sg" [ label = " aurora-sg", fontsize = 12, image = "/home/ec2-user/environment/aws-cdk-backstage-aurora/node_modules/cdk-dia/icons/aws/security_group.png", imagescale = "true", imagepos = "tc", penwidth = "0", shape = "node", fixedsize = "true", labelloc = "b", width = 2, height = 2.266, ]; "AwsCdkBackstageAuroraTsStack/Database" [ label = " Database", fontsize = 12, image = "/home/ec2-user/environment/aws-cdk-backstage-aurora/node_modules/cdk-dia/icons/aws/Service/Arch_Database/64/Arch_Amazon-RDS_64@5x.png", imagescale = "true", imagepos = "tc", penwidth = "0", shape = "node", fixedsize = "true", labelloc = "b", width = 2, height = 2.266, ]; "AwsCdkBackstageAuroraTsStack/ecs-cluster" [ label = " ecs-cluster", fontsize = 12, image = "/home/ec2-user/environment/aws-cdk-backstage-aurora/node_modules/cdk-dia/icons/aws/Service/Arch_Compute/64/Arch_Amazon-Elastic-Container-Service_64@5x.png", imagescale = "true", imagepos = "tc", penwidth = "0", shape = "node", fixedsize = "true", labelloc = "b", width = 2, height = 2.266, ]; subgraph "cluster-SubGraph.backstage-load-balanced-application" { graph [ label = "backstage-load-balanced-application", labelloc = "b", labeljust = "l", margin = "10", fontsize = "16", penwidth = "2", pencolor = "#888888", style = "filled,rounded", fillcolor = "#d6d6d6", ]; "AwsCdkBackstageAuroraTsStack/backstage-load-balanced-application/LB" [ label = " LB", fontsize = 12, image = "/home/ec2-user/environment/aws-cdk-backstage-aurora/node_modules/cdk-dia/icons/aws/Service/Arch_Networking-Content/64/Arch_Elastic-Load-Balancing_64@5x.png", imagescale = "true", imagepos = "tc", penwidth = "0", shape = "node", fixedsize = "true", labelloc = "b", width = 2, height = 2.266, ]; "AwsCdkBackstageAuroraTsStack/backstage-load-balanced-application/DNS" [ label = " DNS", fontsize = 12, image = "/home/ec2-user/environment/aws-cdk-backstage-aurora/node_modules/cdk-dia/icons/aws/Resource/Res_Networking-and-Content-Delivery/Res_48_Dark/Res_Amazon-Route-53-Hosted-Zone_48_Dark_gen.png", imagescale = "true", imagepos = "tc", penwidth = "0", shape = "node", fixedsize = "true", labelloc = "b", width = 1.2, height = 1.466, ]; "AwsCdkBackstageAuroraTsStack/backstage-load-balanced-application/TaskDef" [ label = " TaskDef", fontsize = 12, image = "/home/ec2-user/environment/aws-cdk-backstage-aurora/node_modules/cdk-dia/icons/aws/Resource/Res_Containers/Res_48_Dark/Res_Amazon-Elastic-Container-Service_Task_48_Dark_gen.png", imagescale = "true", imagepos = "tc", penwidth = "0", shape = "node", fixedsize = "true", labelloc = "b", width = 2, height = 2.266, ]; "AwsCdkBackstageAuroraTsStack/backstage-load-balanced-application/Service/Service" [ label = " ECS Service Service", fontsize = 12, image = "/home/ec2-user/environment/aws-cdk-backstage-aurora/node_modules/cdk-dia/icons/aws/Resource/Res_Containers/Res_48_Dark/Res_Amazon-Elastic-Container-Service_Service_48_Dark_gen.png", imagescale = "true", imagepos = "tc", penwidth = "0", shape = "node", fixedsize = "true", labelloc = "b", width = 2, height = 2.266, ]; } } } "AwsCdkBackstageAuroraTsStack/Secret" -> "AwsCdkBackstageAuroraTsStack/Database" [ dir = "both", ]; "AwsCdkBackstageAuroraTsStack/fargate-sg" -> "AwsCdkBackstageAuroraTsStack/ecs-vpc-1" [ dir = "both", ]; "AwsCdkBackstageAuroraTsStack/fargate-sg" -> "AwsCdkBackstageAuroraTsStack/backstage-load-balanced-application/LB" [ dir = "both", ]; "AwsCdkBackstageAuroraTsStack/aurora-sg" -> "AwsCdkBackstageAuroraTsStack/ecs-vpc-1" [ dir = "both", ]; "AwsCdkBackstageAuroraTsStack/aurora-sg" -> "AwsCdkBackstageAuroraTsStack/fargate-sg" [ dir = "both", ]; "AwsCdkBackstageAuroraTsStack/Database" -> "AwsCdkBackstageAuroraTsStack/ecs-vpc-1" [ dir = "both", ]; "AwsCdkBackstageAuroraTsStack/Database" -> "AwsCdkBackstageAuroraTsStack/Secret" [ dir = "both", ]; "AwsCdkBackstageAuroraTsStack/Database" -> "AwsCdkBackstageAuroraTsStack/aurora-sg" [ dir = "both", ]; "AwsCdkBackstageAuroraTsStack/backstage-load-balanced-application/LB" -> "AwsCdkBackstageAuroraTsStack/ecs-vpc-1" [ dir = "both", ]; "AwsCdkBackstageAuroraTsStack/backstage-load-balanced-application/LB" -> "AwsCdkBackstageAuroraTsStack/fargate-sg" [ dir = "both", ]; "AwsCdkBackstageAuroraTsStack/backstage-load-balanced-application/DNS" -> "AwsCdkBackstageAuroraTsStack/backstage-load-balanced-application/LB" [ dir = "both", ]; "AwsCdkBackstageAuroraTsStack/backstage-load-balanced-application/TaskDef" -> "AwsCdkBackstageAuroraTsStack/Secret" [ dir = "both", ]; "AwsCdkBackstageAuroraTsStack/backstage-load-balanced-application/TaskDef" -> "AwsCdkBackstageAuroraTsStack/Database" [ dir = "both", ]; "AwsCdkBackstageAuroraTsStack/backstage-load-balanced-application/Service/Service" -> "AwsCdkBackstageAuroraTsStack/ecs-vpc-1" [ dir = "both", ]; "AwsCdkBackstageAuroraTsStack/backstage-load-balanced-application/Service/Service" -> "AwsCdkBackstageAuroraTsStack/fargate-sg" [ dir = "both", ]; "AwsCdkBackstageAuroraTsStack/backstage-load-balanced-application/Service/Service" -> "AwsCdkBackstageAuroraTsStack/ecs-cluster" [ dir = "both", ]; "AwsCdkBackstageAuroraTsStack/backstage-load-balanced-application/Service/Service" -> "AwsCdkBackstageAuroraTsStack/backstage-load-balanced-application/LB" [ dir = "both", ]; "AwsCdkBackstageAuroraTsStack/backstage-load-balanced-application/Service/Service" -> "AwsCdkBackstageAuroraTsStack/backstage-load-balanced-application/TaskDef" [ dir = "both", ]; }

Running on a Cloud9, installed graphviz with yum. .dot file autocompletes itself.

[vaneek]

Same issue here(cloud9). Interesting project but not useful if doesn't work properly.