Exporting as an SVG in Adobe Illustrator canvas size issues [closed]

Question

I'm having real trouble with saving a simple SVG in Adobe Illustrator.

Illustrator keeps imposing its own canvas size on the export.

This is what I'm doing...

1) Draw an art board around the image

2) File > Save As

3) Change type to SVG

When I view the result, Illustrator has seemed to have resized the canvas arbitrarily

How can I control this so I can get my own size?

Sapota

After researching I've discovered it's not just me - forums.adobe.com/message/2851504 – Sapota

How is this question related to programming? – Absentee

@Bjørn-RogerKringsjå SVG is in XML format and this question solves my problem with adjusting size of an image in HTML / JavaScript – Thread

Answer 1

Your problem is that your SVG is being saved with the Artboard, which is set to the default document size.

Try using "Object > Artboards > Fit to Artwork Bounds" before you save.

Covarrubias

I tried this but still get the whole document image size, any thoughts? – Trash

I figured this out if you have a "layer" on your background. Select it and delete it. Then do what this answer tells you to do. – Mudra

Answer 2

The Mac Finder (which I'm assuming you're using to view your SVGs) tends to ignore SVG boundaries. Shouldn't matter in production, although it's a bit annoying when you're viewing them in a folder.

Open your SVG file in a text editor, paying special attention to the opening tag. Make sure the cartesian coordinates in the "viewbox" attribute matches what you have in mind.

In-depth explanation of what the code means: http://commons.oreilly.com/wiki/index.php/SVG_Essentials/Coordinates

Skidproof

Answer 3

Illustrator has an issue with artboards, ie "viewBox" in the .svg format. Try this: first adjust your artboard/canvas for your graphic in Illustrator, then save the file in .ai format.

Now from the .ai format you can save the file as .svg and your artboard will be as you adjusted it. Next time you open the .svg in Illustrator, the artboard will be messed up again, so you will have to work from the .ai file and just use the .svg on the web.

That means each time you need to adjust an .svg, you need to first save it in .ai-format, adjust the artboard, save it as .ai and then save it as .svg.

If you have a contact address to the people at Adobe, let them know...

True

Answer 4

Sometimes you can unintentionally include small items in the illustration that increases the size. Try pressing Crtl + A to highlight everything in the document. Then, delete any extra items outside the illustration. This should resize the canvas.

Frankish

Answer 5

The solution to this is to use an optimiser like https://petercollingridge.appspot.com/svg-editor

This strips out white space and also optimises the file.

Belligerence