Moving from OmniGraffle to SVG

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.

1. Start playing “Won’t Get Fooled Again” by The Who.
2. Install Adobe Illustrator
3. Open your drawing in OmniGraffle
4. Copy the entire drawing into and paste into Adobe Illustrator
5. In Illustrator File->Save a copy
6. Give a file name
7. Choose “Compressed SVG”
8. Output using settings in dialog screenshot

   

9. Repeat for every single graffle you have
10. 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.

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

5. 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
   

6. 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
   

7. Run visual inspections on your files. You may need to tweak here and there.