Export svg from illustrator including objects outside artboard

Question

I am trying to create a svg for a website, this svg will later be animated (with css & a plugin that removes the hassle).

The artboard is the size of the view for the user, there are other elements in the .ai that will be animated and later on be visible.

How do I save my illustration as svg using Illustrator without losing objects that are outside of my artboard?

A visual representation of what the artboard looks like:

A visual representation of what the current export looks like:

the desired outcome is an .svg that has the same content as the .ai

What if you try File > Export... or File > Export selection...? — Joonas, Commented Sep 19, 2016 at 9:33
The artwork boundaries are removed, this means I have no window for what the user is supposed to see. I could solve this by having a wrapper in the website but then calculation of element size has to be done with either calc() or js, this will reduce browser support. (Plus there is no fallback) — Mike Duister, Commented Sep 19, 2016 at 9:44
Is the artwork that's getting clipped a single shape or multiple? If it's multiple shapes are they grouped? — Mysterfxit, Commented Sep 19, 2016 at 10:37
Multiple shapes (hundreds), they are grouped as one object, per piece and per object — Mike Duister, Commented Sep 19, 2016 at 10:53
The bounds are not removed if you use Export selection. It's just adjusted to the selected object(s). — Joonas, Commented Sep 19, 2016 at 12:00

Mike Duister · Accepted Answer · 2016-09-19 14:42:00Z

1

The solution was unchecking Use Artboards when saving, this was confusing because nearly every tutorial teaches you to enable it for use in web.

answered Sep 19, 2016 at 14:42

Mike Duister

313 bronze badges

Use artboards works as if you were using the art board as a background i.e. if you want the image to be exported with a particular ratio. This makes it great for Web design but can be a pain sometime I generally export from AI and touch up in Photoshop
– Michael Smith
Commented Sep 20, 2016 at 2:39

Add a comment |

Rangel R. Morais · Accepted Answer · 2016-12-18 20:32:47Z

0

You don't need to export the user view, you need to export the entire .svg object.

The code will deal with what the user will see, even with animation.

answered Dec 18, 2016 at 20:32

Rangel R. Morais

1011 bronze badge

Add a comment |

2 Answers 2