Moving from OmniGraffle to SVG

Jesse Anderson
July 5, 2017
Blog
2 Comments

This post shows you how to export your OmniGraffle files to SVG.

…But First a Rant

Wait! I thought OmniGraffle says they support SVGs. Yes, they say they support SVGs. I’ve never been able to get them to work.

In OmniGraffle 6, they started supporting SVG import. I bought OmniGraffle 6 just for that feature. The SVG imports never imported correctly and I couldn’t get 99% of SVGs to import correctly. (As of OmniGraffle 7, they still don’t import correctly)

In OmniGraffle 7, they started supporting SVG export. I bought OmniGraffle 7 just for that feature. The SVG exports never exported correctly. The text kerning was correct and the SVGs were useless.

Maybe you’re starting to see a pattern here?

Or maybe I just didn’t let them know? Or maybe not enough time has went by to fix these bugs?

I first reported the import problem to their support on 9/19/2014. I first reported the export problem to their support on 10/11/2016. I followed up again on 11/1/2016. I kept on following up for months given that SVG support was critical for my use case.

My last email was on 6/22/2017 where I emailed the CEO about the problems. He didn’t even bother to respond.

How to Move From OmniGraffle to SVG

I spent 3 solid days trying to find a solution to this. It wasn’t easy. This is the only one I came up with.

Start playing “Won’t Get Fooled Again” by The Who.
Install Adobe Illustrator
Open your drawing in OmniGraffle
Copy the entire drawing into and paste into Adobe Illustrator
In Illustrator File->Save a copy
Give a file name
Choose “Compressed SVG”
Output using settings in dialog screenshot
Repeat for every single graffle you have
Wonder why you spent the money upgrading OmniGraffle when it doesn’t even work

Work With SVGZs

That will give you Compressed SVG file to start working with. That isn’t the last step.

Make a copy of the compressed SVG just in case
Install Inkscape 0.92
Install xmlstarlet
Wonder why OmniGraffle didn’t care enough about its customers so that you didn’t have to do this manually

Open terminal and run this command. Be sure to change the path to your graffle:

for filename in path/to/*.graffle ; do
    name=$(echo $filename | cut -f 1 -d '.')


    ls -lh "${name}.svgz"


    inkscape "${name}.svgz" --export-plain-svg="${name}.svg" > /dev/null 2>&1

    # Remove the extra (huge) Illustrator stuff for editing
    xmlstarlet ed --delete "//*[local-name()='pgf']" \
    "${name}.svg" > "${name}_out.svg"
    rm "${name}.svg"
    mv "${name}_out.svg" "${name}.svg"
done

Run this command. Be sure to change the path to your SVG:

# Zoom canvas
for filename in path/to/*.svg ; do
    ls -lh "${filename}"
    inkscape --verb=FitCanvasToDrawing --verb=FileSave --verb=FileClose \
    --verb=FileQuit "${filename}" > /dev/null 2>&1

    # Fix too many #38 due to Inkscape bug
    sed -i '' 's/#38;#38;ns_ai;/ns_ai;/' ${filename}
done