7

Ok, so using draw.io desktop, I start a new Blank diagram, and draw just a single textbox with two lines of text inside:

drawio

Then I do File/Export as/SVG..., choose Zoom 100%, uncheck "Include a copy of my diagram", hit Export, save as test.svg - and the result is:

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="81px" height="81px" viewBox="-0.5 -0.5 81 81" style="background-color: rgb(255, 255, 255);"><defs/><g><rect x="0" y="0" width="80" height="80" fill="#ffffff" stroke="#000000" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 78px; height: 1px; padding-top: 40px; margin-left: 1px;"><div style="box-sizing: border-box; font-size: 0; text-align: center; "><div style="display: inline-block; font-size: 12px; font-family: Lucida Console; color: #000000; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; ">Hello<br />World!</div></div></div></foreignObject><text x="40" y="44" fill="#000000" font-family="Lucida Console" font-size="12px" text-anchor="middle">Hello...</text></switch></g></g><switch><g requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"/><a transform="translate(0,-5)" xlink:href="https://desk.draw.io/support/solutions/articles/16000042487" target="_blank"><text text-anchor="middle" font-size="10px" x="50%" y="100%">Viewer does not support full SVG 1.1</text></a></switch></svg>

This file opens fine in Firefox:

svg-in-firefox

However, if I open it in Inkscape 1.0.1 - the text is not fully there:

svg-in-inkscape

... and if I convert this SVG to PDF using rsvg-convert (from mingw-w64-x86_64-librsvg 2.50.1-1, in MSYS2/MINGW64 shell in Windows 10)

rsvg-convert.exe -f pdf -o test.pdf test.svg

... and then I open that PDF in Firefox, I get the text broken again (and same goes if I open this PDF in Adobe Reader, etc):

pdf-in-firefox

As we can see from the SVG content above, the full message here should be "Viewer does not support full SVG 1.1", and that links to https://desk.draw.io/support/solutions/articles/16000042487 , which explains that this is due to word wrapping - and I either have to turn off word wrap in Draw.io (which I do not want - I exactly want to draw boxes with word-wrapped text inside), or export to PDF.

However, I need an .svg, that will go in a pandoc Markdown -> PDF pipeline, and since that also uses rsvg-convert, the .svg images end up being embedded with errors in the document.

So, I was thinking - can I somehow export this kind of SVG1.1 file (with word-wrapped text) to SVG1.0 (with one text line for each line of wrapped text)? If Inkscape could have read this file, I could have used its --export-plain-svg - but as shown above, also Inkscape fails at loading this .svg file...

2
  • hey man. were you able to find a solution to this? Commented Feb 17, 2021 at 11:16
  • 1
    My workaround was to use Draw.io's Export as...>Advanced...>Format(PDF)>Export and have Pandoc's markdown point to the PDF file (with a comment in the Pandoc markdown that I have to update it by hand). It's almost as if SVG 1.1 works only with Draw.io. I know the standard has been somewhat controversial with respect to wrapping text. Commented Jan 26, 2022 at 17:52

2 Answers 2

3

I know that you asked it 5 months ago, but I may answer for others people that have a similar issue.

On draw.io you can use the print functionality to get a PDF. Use that so you can adjust Paper Size to A0 or whatever is according to the size of your diagram.

Finally, you can convert your PDF to SVG file. I use that link : https://image.online-convert.com/fr/convertir-en-svg but you can find multiple web site to do it.

And now, you have the full text within the svg file. I don't know if you can modify it after, but for people who just want to display it on PowerPoint, it's correct.

Hope it helps someone !

1
  • This approach worked for me. My drawing, when exported directly from Draw.io as SVG 1.1 file, was not rendered correctly in Word - multi-line text would be cut off. Exporting it from draw.io as PDF with subsequent conversion to SVG using the linked converter worked well. Commented Sep 10, 2022 at 12:23
0

Specifically for drawio-desktop, in the comments to issue #311 (currently closed as stale), René Beuchat offers an alternative to @emrick-pesce's answer - export as PDF and convert to EMF format (Enhanced Metafile) using Inkscape. In my testing, the formatting was preserved correctly in the EMF.

  1. Save or export as xx.pdf
  2. Use Inkscape program, open or Import the xx.pdf
  3. Select preference: Poppler/Cairo --> OK
  4. Save as... and select xx.emf --> OK

And it's done ! You can use it in word ans crop the expected area.

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .