Rendering Defect

[Werner Strydom]

I have an application that takes a workflow (defined as data), and generates the input for blockdiag to create a diagram of that workflow. Here's the source:

blockdiag {

    orientation = portrait;

    default_fontsize = 16;

    default_fontsize = 16;

    node_width = 200;

    node_height = 100;

    span_width = 150;

    span_height = 150;

    default_node_color = '#FFFFFF';

    default_group_color = '#FFFFFF';

    default_linecolor = '#444444';

    default_textcolor = '#444444';

    

    N2 [label = "N2", shape = box];

    N3 [label = "N3", shape = box];

    N4 [label = "N4", shape = box];

    N5 [label = "N5", shape = box];

    N6 [label = "N6", shape = box];

    N7 [label = "N7", shape = box];

    N8 [label = "N8", shape = box];

    N9 [label = "N9", shape = box];

    N10 [label = "N10", shape = box];

    N11 [label = "N11", width=200, height=10, color='#444444'];

    N12 [label = "N12", shape = box, stacked];

    N13 [label = "N13", shape = box, stacked];

    N14 [label = "N14", shape = box, stacked];

    N15 [label = "N15", shape = box];

    N16 [label = "N16", shape = box, stacked];

    N17 [label = "N17", shape = box, stacked];

    N18 [label = "N18", shape = box, stacked];

    N19 [label = "N19", width=200, height=10, color='#444444'];

    N20 [label = "N20", shape = box, stacked];

    N21 [label = "N21", shape = box, stacked];

    N22 [label = "N22", shape = box, stacked];

    N23 [label = "N23", shape = box];

    N24 [label = "N24", shape = box];

    N25 [label = "N25", shape = box];

    N26 [label = "N26", shape = box];

    N27 [label = "N27", shape = box];

    N28 [label = "N28", shape = box];

    

    N5 -> N10;

    N6 -> N11;

    N7 -> N11;

    N8 -> N11;

    N9 -> N11;

    N10 -> N11;

    N11 -> N12;

    N12 -> N13, N14, N15, N16, N17;

    N13 -> N18, N20;

    N14 -> N19;

    N15 -> N19;

    N17 -> N19;

    N18 -> N19;

    N19 -> N21, N22, N23, N24;

    N23 -> N2, N3, N4;

    N24 -> N25, N26, N27, N28;

    

    group {

        shape = line;

        color = '#444444';

        style = dashed;

        N2;

        N3;

        N4;

        N23;

    }

    

    group {

        shape = line;

        color = '#444444';

        style = dashed;

        N5;

        N6;

        N7;

        N8;

        N9;

        N10;

    }

    

    group {

        shape = line;

        color = '#444444';

        style = dashed;

        N12;

        N13;

        N14;

        N15;

        N16;

        N17;

        N18;

        N20;

    }

    

    group {

        shape = line;

        color = '#444444';

        style = dashed;

        N24;

        N25;

        N26;

        N27;

        N28;

    }

}

There resulting image looks as follows:

The diagram creates the impression that N14 goes to N20, which it doesn't. Only N13 goes to N20 and N18. N14 only goes to N19 (the bar at the bottom).  

What I'm trying to show is that N18, N20, N14, N15, N16, N17 must complete before proceeding to N21, N22, N23 and N24. 

N19 was only added because the diagram became unreadable without it.

Any suggestions?

Werner