graphviz-visual-editor icon indicating copy to clipboard operation
graphviz-visual-editor copied to clipboard

Spacing weirdness in HTML-like labels

Open ferdnyc opened this issue 1 year ago • 5 comments

The Visual Editor seems to have a layout bug when displaying HTML-like labels that contain spaces after tags. This source:

graph g {
  n [label=<Wow, <font color="blue">some</font> text>];
}

Renders as: image

Inserting a second space fixes the layout:

graph g {
  n [label=<Wow, <font color="blue">some</font>  text>];
}

image

ferdnyc avatar Jun 19 '24 00:06 ferdnyc

This is reproducible with Graphviz CLI tools:

echo 'graph g {n [label=<Wow, <font color="blue">some</font> text>];}' | dot -T svg > tmp.svg

renders:

tmp

dot -V =>

dot - graphviz version 12.2.0~dev.20241001.1034 (20241001.1034)

This was a Windows 64-bit Debug build, built from https://gitlab.com/graphviz/graphviz/-/commit/583da8fbb657a8486ed4ea69a1bdbfa19aeafd91.

magjac avatar Oct 02 '24 17:10 magjac

Hmm. It seems that "it depends", whether graphviz exhibits this bug. On my own Fedora 40 build of dot - graphviz version 12.2.1~dev.20241107.1950 (20241107.1950), I get:

$ echo '
graph g {
  n [label=<Wow, <font color="blue">some</font> text>];
}' | ./_dist/bin/dot -Tsvg > /tmp/sometext.svg

sometext

The difference may be the cairo renderer that's presumably used for SVG on my system, but possibly not on Windows / the Visual Editor.

ferdnyc avatar Nov 08 '24 05:11 ferdnyc

(I assume the SVG source produced is the same in all cases? Specifically:

<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"
 "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<!-- Generated by graphviz version 12.2.1~dev.20241107.1950 (20241107.1950)
 -->
<!-- Title: g Pages: 1 -->
<svg width="187pt" height="44pt"
 viewBox="0.00 0.00 187.23 44.00" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<g id="graph0" class="graph" transform="scale(1 1) rotate(0) translate(4 40)">
<title>g</title>
<polygon fill="white" stroke="none" points="-4,4 -4,-40 183.23,-40 183.23,4 -4,4"/>
<!-- n -->
<g id="node1" class="node">
<title>n</title>
<ellipse fill="none" stroke="black" cx="89.61" cy="-18" rx="89.61" ry="18"/>
<text text-anchor="start" x="33.74" y="-14.32" font-family="Times,serif" font-size="14.00">Wow, </text>
<text text-anchor="start" x="74.99" y="-14.32" font-family="Times,serif" font-size="14.00" fill="blue">some</text>
<text text-anchor="start" x="112.49" y="-14.32" font-family="Times,serif" font-size="14.00"> text</text>
</g>
</g>
</svg>

ferdnyc avatar Nov 08 '24 05:11 ferdnyc

Actually, maybe I shouldn't assume that. In the VE, the SVG source for the canvas with that graph is,

<svg width="506" height="966" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0.00 0.00 156.12 44.00">
<g id="graph0" class="graph" transform="translate(4.000002384185791, 40)">
<title>g</title>
<polygon fill="white" stroke="none" points="-4,4 -4,-40 152.12,-40 152.12,4 -4,4"></polygon>
<!-- n -->
<g id="node1" class="node">
<title>n</title>
<ellipse fill="none" stroke="black" cx="74.06" cy="-18" rx="74.06" ry="18"></ellipse>
<text text-anchor="start" x="28.38" y="-14.8" font-family="Times,serif" font-size="14.00">Wow, </text>
<text text-anchor="start" x="65.7" y="-14.8" font-family="Times,serif" font-size="14.00" fill="blue">some</text>
<text text-anchor="start" x="95.25" y="-14.8" font-family="Times,serif" font-size="14.00"> text</text>
</g>
</g>
</svg>

ferdnyc avatar Nov 08 '24 05:11 ferdnyc

It looks like this is a variation on the already-reported https://gitlab.com/graphviz/graphviz/-/issues/1891

ferdnyc avatar Nov 08 '24 10:11 ferdnyc