search

magjac / d3-graphviz

Graphviz DOT rendering and animated transitions using D3
BSD 3-Clause "New" or "Revised" License
1.68k stars 103 forks source link

Distance between horizontal nodes shrinks if you specify fontname sans-serif, but with fontname Arial result is fine #252

Closed reregaga closed 1 year ago

reregaga commented 1 year ago

Script:

digraph {
    splines=false
    node [shape=box]

    b_start [label="Bob"]
    b_0 [label="" shape=point height=0]
    b_1 [label="" shape=point height=0]
    b_end [label="Bob"]
    b_start -> b_0 -> b_1 -> b_end [style="dashed" arrowhead="none"]

    a_start [label="Alice"]
    a_0 [label="" shape=point height=0]
    a_1 [label="" shape=point height=0]
    a_end [label="Alice"]
    a_start -> a_0 -> a_1 -> a_end [style="dashed" arrowhead="none"]

    {rank=same; b_0 -> a_0 [weight=0 arrowhead=vee fontname="Arial" label=<<B>1 </B>Authentication request>]}
    {rank=same; a_1 -> b_1 [weight=0 arrowhead=vee fontname="Arial" label=<<B>2 </B>Authentication response>]}
}

Link to editor Result: mj-arial

If you change fontname Arial to sans-serif, result: ss

If you run dot -Tpng i.gv -o o.png, it works as expected in both cases: arial

magjac commented 1 year ago

I think this problem is due to the graph being rendered with access to certain fonts, while being viewed without access to the same fonts. See https://gitlab.com/graphviz/graphviz/-/issues/1891 or https://github.com/mdaines/viz.js/issues/81 for similar problems.

In any case, it's most certainly not a problem in d3-graphviz itself so I'm closing this issue now. Please feel free to reopen if you disagree.