d2 icon indicating copy to clipboard operation
d2 copied to clipboard

Container labels don't respect margins in Dagre and TALA

Open villesalmela opened this issue 1 year ago • 1 comments

In short

It appears to me that in Dagre and TALA layouts, container labels have no margin or don't respect them. All works as expected, until you put something inside a shape, thus making it a container.

I'm pretty sure this isn't expected behavior, but correct me if I'm wrong.

ELK handles all the cases I've tested without issues.

Details

  • With plain shapes, the label does not cross the shape outline. This is expected.
  • With containers, the label can cross the shape outline and overlap with other objects. Sometimes the label doesn't fit the view and part of it gets cut off. This is unexpected.

TALA usually avoids the issue due to its creative, more flexible label positioning. However, if you use label.near, then TALA loses its advantage and starts behaving like Dagre (in the context of this issue).

Demonstration

Compiled using v0.6.3, sketch mode enabled. The images have not been cropped.

Plain shapes ✅

*.label.near: top-left
a: "Internal Corporate Network"
b: "External Partner Network"
a -> b

Dagre test_shape_dagre TALA test_shape_tala

Containers without label.near ⚠️

a: "Internal Corporate Network"
b: "External Partner Network"
a.VLAN1
b.VLAN2

Dagre test_container_dagre2

Containers with label.near ⚠️

*.label.near: top-left
a: "Internal Corporate Network"
b: "External Partner Network"
a.VLAN1 -> b.VLAN2

Dagre test_container_dagre TALA test_container_tala

villesalmela avatar Jan 22 '24 23:01 villesalmela

cf.

[case 1] dagre https://play.d2lang.com/?l=&script=SrRSUPLMK0ktykvMUXDOLyrIL0osSVXwSy0pzy_KVlKozklMSs3Ry0tNLLJSKMkv0E1OBamu5UqyUlByrYBqDEgsKslLLSJCW6JemI-jnyFXEpg24gIEAAD__w%3D%3D&layout=dagre& elk https://play.d2lang.com/?l=&script=SrRSUPLMK0ktykvMUXDOLyrIL0osSVXwSy0pzy_KVlKozklMSs3Ry0tNLLJSKMkv0E1OBamu5UqyUlByrYBqDEgsKslLLSJCW6JemI-jnyFXEpg24gIEAAD__w%3D%3D&layout=elk&

[case 2]

dagre https://play.d2lang.com/?l=&script=SrRSUPLMK0ktykvMUXDOLyrIL0osSVXwSy0pzy_KVlKozklMSs3Ry0tNLLJSyC8tKc5MSdUtyS_QTU4F6arlSrJSUHKtgBoQkFhUkpdaRIL2RL0wH0c_Q64kMG3EBQgAAP__&layout=dagre&

elk https://play.d2lang.com/?l=&script=SrRSUPLMK0ktykvMUXDOLyrIL0osSVXwSy0pzy_KVlKozklMSs3Ry0tNLLJSyC8tKc5MSdUtyS_QTU4F6arlSrJSUHKtgBoQkFhUkpdaRIL2RL0wH0c_Q64kMG3EBQgAAP__&layout=elk&

bo-ku-ra avatar Jan 24 '24 00:01 bo-ku-ra