松散边缘太长

Question

在下面的DOT图表中，handleClick中onSelect和COLOROPTION之间的边缘太长了。如何将其变成紧凑的循环？

如果DIV距COLOROPTION右侧更远，那也会更好。

循环边缘为option:p4:e -> option:p3:e。

digraph struct {
    rankdir=LR;
    graph [];
    node [shape=record];
    edge [arrowhead=onormal];

    select [label="COLORSELECT|<p1> options|<p2> handleSelect"];

    op [label="option"];
    select:p1 -> op [dir=both, arrowtail=oinv];

    option [label="COLOROPTION|<p1> color|<p2> text|<p3> onSelect|<p4> handleClick"];
    op -> option:p1:w;
    op -> option:p2:w;
    select:p2 -> option:p3 [dir=both, arrowtail=normal, taillabel="(text)"];
    option:p4:e -> option:p3:e [
        arrowhead=normal,
        taillabel="(event)", labeldistance=4, labelangle=80
    ];

    div [label="DIV|<p1> style.color|<p2> content|<p3> onClick"];
    option:p1 -> div:p1;
    option:p2 -> div:p2;
    option:p4:se -> div:p3 [dir=both, arrowtail=normal, taillabel="(event)"];   
}