[Feature] Local direction inside containers

[zzgab]

Currently the direction is only on root-level.

I would like to obtain this result:

  A
  |
  B — E
  |
  C
  |
  D

I tried with direction: down but the layout will put C and E on an equal row.
I tried to make a transparent container for B and E, but even inside this container, the applied direction is down, yet I would like it to be right.

(I also tried using imports, where the desired direction is specified inside the imported file, but it is ignored.)

I wonder if it is possible to implement inner-direction for a container.

Thanks

[bo-ku-ra]

i hope this and #949 are resolved together.

[zzgab]

Thanks 🙏 Sorry for the kind of duplicate!
Awesome work.

[AndreiPashkin]

@zzgab

It seems like ELK.js layout engine doesn't support this:
kieler/elkjs#26

[alixander]

yeah that's right. works in TALA but not for other layout engines, fundamental restrictions with their algorithms unfortunately

[AndreiPashkin]

This thing made me moving to Mermaid.js

[alixander]

@AndreiPashkin Mermaid.js can't do it either, they use dagre too.

[bo-ku-ra]

It's not impossible.

https://play.d2lang.com/?l=&script=VIxBCoMwEEX3OcXHZSGDUVdzmzQJ6YA1ElOKSO9eRty4ebzhDT9XiTaU-fNeNoYz5539yuhNLV-nGBhHlJpCk7IwquRX-2kYFZPiweg6HFvb50Rl9UHazujPL0ce1kKH6HnZSOGyiaK5pYGS-QcAAP__&

grid-columns: 1
grid-gap: 0
row1
row2: {direction: right}
row3
row4
row*: "" {style.opacity: 0}
row1.a -- row2.b -- row3.c -- row4.d
row2.b -- row2.e

[zzgab]

@bo-ku-ra Thank you for the snippet.
Indeed, it gets close, with two reservations:

1. At the time of my post, D2 did not yet allow for arrows on a Grid diagram.
2. It is still a Grid diagram... now I have to do everything according to this peculiar layout, which is not wat I intended initially.

In my eyes it remains a major drawback of the engine.

But, thanks for the example really!