SVG Images are not rendering texts properly

Question

I have encountered issues when uploading SVGs into pages where my texts are not properly rendered. - See After Publishing

I have a SVG file with default system font (Segoe UI) but it does not properly rendered when I publish this. I can't have an option to upload JPEG since I'm using diagrams such as flowchart. - Texts are getting blurred.

Does we have alternative solution for this? Thank you!

Original SVG file (redacting some text due to data confidentiality)

After Publishing:

Spencer Sharpe · Answer

Similar issue. Image and text look great in editor, and even looks good initially after publishing. But when I refresh the page the image is blurry and the text, while not rendered as rectangles, is rendered disproportionate to the rest of the image.

Stéphane Chambrin · Answer

Additional note:

This article from Draw.io help site offers a good explanation, and a way to fix it (at least for SVG produced by Draw.io)
https://desk.draw.io/support/solutions/articles/16000042487-learn-why-text-in-exported-svg-images-may-not-display-correctly

Stéphane Chambrin · Answer

Same issue here.
Editor displays SVG text correctly, but I also get the empty rectangles when viewing the page in Confluence.
Strangely (or not), viewing the page in Jira Service Desk shows correct text.