5

Is there a way to remove path/group transformations when exporting as SVG with Illustrator? My problem is similar to this one but the given solution is only for Inkscape.

  • When do you get a transform attribute when exporting from Illustrator? I've never seen that and can't reproduce it now (I'm using CS6 and I believe SVG is handled differently in CC so that may be relevant). – Cai May 1 '16 at 20:40
  • @CAI, i'm on CC but try to reproduce it by transforming the shape first (rotate it), then go to save as > SVG > show SVG code, there should be a "transform" attribute – Elbasan May 1 '16 at 20:47
  • I tried that. No transform attribute. CC must have changed that because AFAIK Illustrator always expands any transforms/effects when saving as SVG and I can't set it to do otherwise. – Cai May 1 '16 at 20:53
  • Does expanding appearance help? I assume that would fix it. – Cai May 1 '16 at 20:57
  • Problem is that if you draw a perfectish box for example then illsutrator will make it a box and since a box cant be slanted then it will add a transform. However if your shape is one that says polygon or path then you can try if selecting object with black arrow and choosing Object -> transform-> Reset Bounding Box helps. I dont have CC so mine does not behave this way (theres only 2 features i would be glad to take in CC but 8 problems i cant afford to take on, plus subscription). – joojaa Jul 7 '16 at 19:13
2

Using Illustrator CC -- After trying several of these tips without success, I was able to finally convert/export to SVG:

1) Set Artboard's X and Y to 0: enter image description here

2) Use Export As... and select to Use Artboards. enter image description here

3) After clicking Export button, SVG Options window opens, and select following settings: enter image description here

No more Transform/Expand errors! Hope this works for others :-)

0

Select the shape then go to Object > Expand > Select Fill & Stroke > OK

enter image description here

  • I'm assuming you would want to expand appearance, not the fill and stroke. – Cai May 1 '16 at 20:54
  • Stroke and fill are lost when expanding, thats why you expand both – Elbasan May 1 '16 at 21:53
  • Stroke and fill aren't lost when expanding? That would make expanding appearance pretty useless. Anything that isn't expanded isn't affected. – Cai May 1 '16 at 23:34
  • And having intact strokes is very useful.. You don't want to be expanding stuff unnecessarily – Cai May 1 '16 at 23:35
  • When I go to "Object > Expand", I don't see a menu for "Select Fill & Stroke". How do I open that menu? Are you going to "Object" from the top menu bar? – Microcipcip May 2 '16 at 0:29
0

I'm not sure there's a one-click fix, but I solved the issue when working with simple shapes and paths by using "Unite" button in the Pathfinder pallet. You should actually see the bounding box change rotation as you click it.

However, some primitive shapes (ellipse, rect) were exported by Illustrator with transforms even after applying Unite. I solved this in my project by altering the points of the shape just slightly using the direct select tool.

The key seemed to be getting illustrator to output the svg using a path or polygon tags rather than svg's native rect or ellipse.

Illustrator CC v. 19.2.1

0

As far as I can tell only rectangles and ellipses will have the 'transform' attribute applied to them...

Here is a simple square:

Square one

And here is its relevant bit of code:

<rect x="95" y="95" width="470" height="470" fill="none" stroke="#0f6fa3" stroke-miterlimit="10" stroke-width="24"/>

That's 116 characters.

Here, the same square rotated:

Square one rotated

And its code:

<rect x="95" y="95" width="470" height="470" transform="translate(-99.59 147.65) rotate(-22)" fill="none" stroke="#0f6fa3" stroke-miterlimit="10" stroke-width="24"/>

That's 165 characters... Now the same square with a single anchor point added:

Square one with an extra anchor point

Resulting code:

<polygon points="635.92 459.86 200.14 635.92 24.08 200.14 142.31 152.38 459.86 24.08 635.92 459.86" fill="none" stroke="#0f6fa3" stroke-miterlimit="10" stroke-width="24"/>

And this last example weighs in at 171 characters...

So it seems that leaving the transform attributes alone may actually be more efficient anyhow...

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.