Exporting AI to SVG creates a 10KB blank SVG

[tiadaguru]

Hello! I have an unusual problem. I had an EPS, which I opened with Adobe Illustrator 24.1.1, made some color changes, and then saved as the standard *.ai format.

If I export it as a PNG or JPG, there's no issue. If I export it as an SVG, it comes out completely blank (though the SVG code is definitely there). Opening the SVG in any browser, in Illustrator, in SVG editing tools = blank. Nothing. 

I've tried all of these changes, with zero effect:

• Change the decimal precision from 1 to 2 to 3 to 4 to 5 (no difference)
• Change the styling from Internal CSS to Inline Style to Presentation Attributes (no difference)
• Saving as a SVG (instead of Export), which creates a 95% blank SVG with a few random objects

The file itself...isn't complex: it's overlapping rectangles with circular gradients. Have I violated some law of SVGs? This does not occur with other EPS or other AI files. Just this one. My SVG settings:

 
The poorly-behaving AI file, the broken SVG, and the properly-working PNG are linked here: https://drive.google.com/drive/folders/1rfhYgh-1jZANAXJS02VZHaOgp0jzY_DA?usp=sharing 

Adobe Illustrator 24.1.1 (CC subscription)

Windows 10 Pro x64 1909 (18363.657)

Intel i5-8600K + 32 GB DDR4-3200

Samsung 960 EVO 250 GB

[Mylenium · Accepted solution]

Likely you need to change the complete layer structure and reorganize your file. SVG is as much about structure as it is about visual representation ansd surely just importing a potentially terrible EPS with tons of issues like stray paths, tiny non-convex areas and so on is not ideal. I can't check your actual file, but I'd bet that this is one of those cases...

Mylenium

[tiadaguru]

Thank you! This gave me the motivation to re-create the layout. It worked WILDLY better. I was getting insane 1MB SVG exports with some unusual online tools. It's literally boxes:

Here's how I recreated it, for future posters:

1. Open the original EPS->AI converted file in Illustrator. Copy its artboard dimensions & create a new AI file with those same dimensions.
2. Select one of the paths (yes, the original file used paths for these boxes!) in the original file, copy it with CTRL+C and paste it with CTRL+F (to maintain positioning) into the new AI file.
3. Create a new rectangle to match the original shape (or whatever shape you've got). Somehow, this new rectangle picked up the original gradient; this was the wildest part because I must've missed how it got set.
4. Then, delete the path. For me, I also needed to change the layer blend mode to multiply for this kind of unique transparency effect.
5. Continue for each object. Copy-paste the path with CTRL+C / CTRL+F, trace out the shape with the rectangle tool, and remove the path. Add adjustments as needed.

This turned a 900 KB PNG (3200px width), a broken 1MB SVG, and a pixellated 300 KB JPG into a pixel-perfect...drumroll.....9 KB SVG!

Yes. 9 KB SVG. That's what I had expected, honestly, from the get-go.

Thank you for the support, mylenium.