Converting Formatted Text to SVG

[alderg]

SVG Label Rendering Option

By default, formatted text and text with word wrapping are rendered as HTML using foreignObject elements. However, this approach may cause compatibility issues in certain viewers.

Enabling this option will attempt to render labels as SVG, using <text> and <tspan> elements instead of HTML. Currently, the following is supported: bold, italic, underline, strikethrough, ^superscript, _subscript, <font> and <span> elements. If the label cannot be represented as SVG, a foreignObject will be used instead.

Note: Word wrapping is disabled for labels that were successfully converted when this option is enabled.

Requires v28.0.3 or later

[Ethsan]

Hey,

Thanks a lot for that feature!

Are you planning on implementing a way to explicitly emit an error/warning during drawing or/and exporting to svg, rather than silently falling back to foreignObject ?

[fornax-a]

This feature is indeed useful - I wonder, could it be extended to include the background color also?

I realise that technically SVG canvas color does not exist, but this can be overcome by using <rect width="100%" height="100%" ...> and placing everything else on top of that.

Indeed that appears to be what happens when you export diagrams via [File > Export as > SVG] and deselect transparent background.

Certainly this would help for many of my own diagrams, which rely on the label background color to contrast against underlying objects.

[alderg]

Use Convert labels to SVG instead:

See #5165

[alderg]

Updated behavior: "Convert labels to SVG" is now disabled for labels with unsupported HTML

Starting with version 29.6.7, the Convert labels to SVG checkbox in the Format panel is grayed out and disabled when any selected cell's label contains HTML elements that cannot be converted to native SVG text.

Previously, enabling this option on a label with unsupported HTML would silently fall back to foreignObject rendering. Now, the UI prevents enabling the option in the first place and shows a tooltip listing the supported elements.

Additionally, word wrapping is now supported for labels that have been converted to SVG. This removes the previous limitation where word wrapping was disabled for successfully converted labels.

Supported HTML elements for SVG conversion:

• Block elements: <h1> through <h6>, <div>, <p>, <pre>, <blockquote>
• Inline elements: <b>, <i>, <u>, <strike>, <sup>, <sub>, <span>, <font>, <br>

What is NOT supported (will cause the option to be disabled):

• <table>, <ul>, <ol>, <li>, <a>, <img>, and any other HTML elements not listed above
• Any element with a background-color CSS style

If you need SVG-compatible output and your label contains unsupported elements, reformat the label to use only the supported elements listed above.