drawthe.net draws network diagrams dynamically from a text file describing the placement, layout and icons. Given a yaml file describing the hierarchy of the network and it's connections, a resulting diagram will be created.
I'm looking to create some nested containers (trying to diagram AWS VPC, AZ, subnets), and it would be nice to space so they don't all land on top of each other.
`diagram:
fill: "snow"
columns: 21
rows: 21
gridLines: false
gridPaddingInner: .4
groupPadding: .33
margins: {top: 20, right: 20, bottom: 50, left: 20 }
iconTextRatio: .33
title:
color: black
heightPercentage: 6
logoFill: none
stroke: lightgrey
type: "bar"
cisco: &cisco
color: black
fill: white
stroke: black
iconFamily: cisco
aws: &aws
color: black
fill: white
stroke: black
iconFamily: aws
cloud: &cloud
<<: *cisco
iconStroke: black
iconStrokeWidth: 2
groups:
public sub 1: { <<: subnet, name: public sub 1, members: [firewall1] }
private sub 1a: { <<: subnet, name: private sub 1, members: [vma,vmb,vmc] }
private sub 1b: { <<: subnet, name: private sub 2, members: [proxy,vm1,vm2,vm3,vm4,vm5] }
AZ1: { <<: az, name: Availability Zone 1, members: [public sub 1,private sub 1a,private sub 1b] }
I'm looking to create some nested containers (trying to diagram AWS VPC, AZ, subnets), and it would be nice to space so they don't all land on top of each other.
`diagram: fill: "snow" columns: 21 rows: 21 gridLines: false gridPaddingInner: .4 groupPadding: .33 margins: {top: 20, right: 20, bottom: 50, left: 20 } iconTextRatio: .33 title: color: black heightPercentage: 6 logoFill: none stroke: lightgrey type: "bar" cisco: &cisco color: black fill: white stroke: black iconFamily: cisco aws: &aws color: black fill: white stroke: black iconFamily: aws cloud: &cloud <<: *cisco iconStroke: black iconStrokeWidth: 2
instance: &instance {<<: aws, icon: "cmpt_ec2_instance"} router: &router {<<: cisco, icon: "router"} firewall: &firewall {<<: *cisco, icon: "firewall"}
icons: firewall1: {<<: firewall, x: 6, y: 17} vma: {<<: instance, x: 5, y: 15} vmb: {<<: firewall, x: 6, y: 15} vmc: {<<: instance, x: 7, y: 15} proxy: {<<: instance, x: 6, y: 13} vm1: {<<: instance, x: 4, y: 12} vm2: {<<: instance, x: 5, y: 12} vm3: {<<: instance, x: 6, y: 12} vm4: {<<: instance, x: 7, y: 12} vm5: {<<: instance, x: 8, y: 12}
connections:
vpc: &vpc color: "black" stroke: "black" fill: "none" strokeWidth: .5 textLocation: leftMiddle
az: &az color: "black" stroke: "black" fill: "none" strokeWidth: .5 strokeDashArray: [3,3] textLocation: topRight
subnet: &subnet color: "black" stroke: "black" fill: "none" strokeWidth: .5 textLocation: topLeft
groups: public sub 1: { <<: subnet, name: public sub 1, members: [firewall1] } private sub 1a: { <<: subnet, name: private sub 1, members: [vma,vmb,vmc] } private sub 1b: { <<: subnet, name: private sub 2, members: [proxy,vm1,vm2,vm3,vm4,vm5] } AZ1: { <<: az, name: Availability Zone 1, members: [public sub 1,private sub 1a,private sub 1b] }
ProdVPC1: { <<: *vpc, name: Prod VPC 1, members: [AZ1] } `
How can I get some spacing between ProdVPC1 and AZ1 groups? I've read through the docs, I've fiddled around a ton, I just can't seem to figure it out.