GraphLinksModel with TextBlock above shape


I use GoJS library for genogram diagram component.

I need to display some member text information above it. The problem is that the text can have different length and members are not at the same height:

I have implemented a simplified example of the diagram which shows the problem:

I want to position nodes something like this:

Please, let me know how I can fix it.

By default the nodes in each layer are aligned at the top. If you want to align them at the bottom, modify the code in GenogramLayout.assignLayers to be:

      . . .
      // now make sure every vertex has the maximum width or height according to which layer it is in,
      // and aligned on the right (if horizontal) or the bottom (if vertical) {
        var lay = v.layer;
        var max = maxsizes[lay];
        if (horiz) {
          v.focus = new go.Point(v.width - max, v.height / 2);
          v.width = max;
        } else {
          v.focus = new go.Point(v.width / 2, v.height - max);
          v.height = max;
      . . .

@walter , thank you for your reply!
Unfortunately, the modification didn’t help me with the problem. Maybe it’s because I have other GenogramLayout modifications and they conflict.
As an acceptable solution, I have implemented dynamically setting margin-top for text blocks using the formula (briefly): = “max height of text blocks on the same level” - textblock.height.
So, it’s solved for me.