Note that there are some explanatory texts on larger screens.

plurals
  1. POedges not obeying port specifications in DOT file
    text
    copied!<p>I'm trying to generate class diagrams for a tool I'm writing, however I can't seem to get the layout correct.</p> <p>Here's my sample dot file generated from real data:</p> <pre><code>digraph G { fontname = "Bitstream Vera Sans" fontsize = 8 splines = "ortho" node [ fontname = "Bitstream Vera Sans" fontsize = 8 shape = "record" ] edge[ arrowtail="empty" dir="back" ] Baseclass [ label = "{xxxxxxxxxx::Baseclass||+ xxxxxxxxxxx \l+ xxxxxxx \l+ xxxxxxxxx \l+ xxxxxxxxxxx \l+ xxxxxxxxxxx \l+ xxxxxxxxxxxx \l+ xxxxxxxxxxxx \l+ xxxxxxxxxxxxxxxxx \l+ xxxxxxxxxxxxxxxxxx \l+ xxxxxxxxxxxxxxxxx \l+ xxxxxxxxxxxxxxxxxx \l+ xxxxxxxxxxx \l+ xxxxxxxxxxxx \l+ xxxxxxxxxxxxxxxx \l+ xxxxxxxxxxx \l+ xxxxxxx \l+ xxxxxxxxxxx \l+ xxxxxxxxxx \l+ xxxxxxxx \l+ xxxxxxxx \l+ xxxxxxxxxxxxxxxxxxxx \l+ xxxxxxxxxxxxxxxxxxxxx \l+ xxxxxxxxxxxxx \l+ xxxxxxxxxxxxxxxxxx \l+ xxxxxxxxxxxxxxxx \l+ xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx \l+ xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx \l+ xxxxxxxxxxxxxxxxxxxxxx \l+ xxxxxxxxxxxxxxx \l+ xxxxxxxxxxxxxxxxxxxxxxxxxxxxxx \l}" ] SubclassOne [ label = "{xxxxxxxxxx::SubclassOne||+ xxxxxxxxxxx \l+ xxxxxxxxxxx \l+ xxxxxxxxxxx \l+ xxxxxxxxxxxx \l+ xxxxxxxxxxxxxxxxxx \l+ xxxxxxxxxxxxxxxxxx \l+ xxxxxxxxxxxx \l+ xxxxxxxxxxxxxxxx \l+ xxxxxxx \l+ xxxxxxxxxxx \l+ xxxxxxxxxx \l+ xxxxxxxx \l+ xxxxxxxxxxxxxxx \l- xxxxxxxxxxxxxxxxxxxxx \l- xxxxxxxxxxxxxxxxxxxxxx \l- xxxxxxxxxxxxxxxxxx \l}" ] SubclassTwo [ label = "{xxxxxxxxxx::SubclassTwo||+ xxxxxxxxxxxxxxxxx \l+ xxxxxxxxxxx \l+ xxxxxxx \l+ xxxxxxxxxxx \l+ xxxxxxxxxxx \l+ xxxxxxxxxxxx \l+ xxxxxxxxx \l+ xxxxxxxxxxxxxxxxxx \l+ xxxxxxxxxxxxxxxxxx \l+ xxxxxxxxxxxx \l+ xxxxxxxxxxxxxxxx \l+ xxxxxxxx \l+ xxxxxxxxxxxxxxx \l}" ] SubclassThree [ label = "{xxxxxxxxxx::SubclassThree||+ xxxxxxxxxxxxxxxxxxxx \l+ xxxxxxxxxxxxxxxxxxxxxx \l+ xxxxxxxxxxxxxxxxxx \l+ xxxxxxxxxxxxxxxxxx \l+ xxxxxxxxxxxxxxxxxxxx \l+ xxxxxxxxxxxxxxxxx \l+ xxxxxxxx \l+ xxxxxxxxxxxxx \l+ xxxxxxxxxxxxxxxxxxxxxxx \l+ xxxxxxxxxxxxxxxxxxx \l+ xxxxxxxxxxxx \l+ xxxxxxxxxxxxxxx \l+ xxxxxxxxxxxxxxxxxxxxxxxx \l+ xxxxxxxxxxxxxxxxxxxxxxxx \l+ xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx \l+ xxxxxxxxxxxxxxxxxx \l+ xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx \l+ xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx \l+ xxxxxxxx \l+ xxxxxxxxxxxxxxxxxxx \l+ xxxxxxxxxxxxxxxx \l+ xxxxxxxx \l+ xxxxxxxxxxxx \l+ xxxxxxxxxxxxxxxx \l+ xxxxxxxxxxxxxxxxxxxxxxxxxxxxxx \l+ xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx \l- xxxxxxxxxxxxxxxxxxxxxxxx \l- xxxxxxxxxxxxxxxxxxxxxxxxxxxxx \l- xxxxxxxxxxxxxxxxxxxxxxxxxxx \l- xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx \l- xxxxxxxxxxxxxx \l- xxxxxxxxxxxxxxxxxxxx \l}" ] SubclassFour [ label = "{xxxxxxxxxx::SubclassFour||+ xxxxxxxxxxxxxxxxxx \l+ xxxxxxxxxxxxxxxxxxxxx \l+ xxxxxxxxxxxx \l+ xxxxxxxxxxx \l+ xxxxxxxxxx \l+ xxxxxxxxxxxxxxxxxx \l+ xxxxxxxxxxxxxxxxxx \l+ xxxxxxxx \l+ xxxxxxxx \l- xxxxxxxxxxxxxxxxxxxxxx \l- xxxxxxxxxxxxxxxxx \l}" ] SubclassFive [ label = "{xxxxxxxxxx::SubclassFive||+ xxxxxxxxxxx \l+ xxxxxxxxxxx \l+ xxxxxxxxxxx \l+ xxxxxxx \l+ xxxxxxxxxxxx \l+ xxxxxxxxxxxxxxxxxx \l+ xxxxxxxxxxxxxxxxx \l+ xxxxxxxxxxxxxxxxxx \l+ xxxxxxxxxxx \l+ xxxxxxxx \l+ xxxxxxxxxxxxxxx \l- xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx \l}" ] Baseclass:s -&gt; SubclassOne:n; Baseclass:s -&gt; SubclassTwo:n; Baseclass:s -&gt; SubclassThree:n; Baseclass:s -&gt; SubclassFour:n; Baseclass:s -&gt; SubclassFive:n; } </code></pre> <p>Which generates the following image using graphviz: <img src="https://i.stack.imgur.com/2XH6E.png" alt="Output of the given dot file"></p> <p>I changed the order of the edge relationships to point from the base to the subclass (with a tail arrow) so that the subclass would be ordered higher vertically than the base classes. Long method names are overflowing their containers, and the relationship edges aren't obeying the specified ports on the tail end. It looks like their X position is correct, but the y possition is not. I'd prefer it to look <a href="http://www.cs.colorado.edu/~kena/classes/6448/f08/_Media/homework1-2.png" rel="nofollow noreferrer">something like this</a> where both the subclass relationship arrows are combined to form a single connection with the bottom center point in the superclass container. If I remove the port specifications, the edges no longer clip into the nodes they connect, but the layout is still not what I'd consider ideal.</p> <p><img src="https://i.stack.imgur.com/gbuUq.png" alt="Without explicit port specifications"></p>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload