I create a new Illustrator file, draw a graphic element and convert it to a symbol. I save the file as SVG. In the SVG file, the graphic element in the symbol is drawn upside-down i.e., its transformation matrix is the form

transform="matrix(1 0 0 -1 ...)"

(See full code below).

The overall result looks OK, since when the symbol is used, again the same transformation matrix is applied. This is annoying, since other elements are not inverted, and I need a more uniform format for my later purposes. This might be related to the viewbox problem, which is also apparent in the code below.

The question is: what is the cause of the inverted elements? Is there any way of avoiding them, yielding an svg with transformation matrices oriented upwards?

<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
     viewBox="0 0 1920 1080" style="enable-background:new 0 0 1920 1080;" xml:space="preserve">
<symbol  id="letter" viewBox="-3.67 -6.52 7.34 13.04">
    <text transform="matrix(1 0 0 -1 -3.6724 -3.522)" style="font-family:'MyriadPro-Regular'; font-size:12px;">A</text>
<use xlink:href="#letter"  width="7.34" height="13.04" x="-3.67" y="-6.52" transform="matrix(1 0 0 -1 185.9453 274.2964)" style="overflow:visible;"/>

Edit: this problem is also discussed here

  • So what's your question? Could you edit to make it more clear? – Luciano Aug 25 '16 at 8:45
  • I've edited my question, hope that the question is clearer now. – szymtor Aug 25 '16 at 9:04

Illustrator does its best to maintain transformations, to reduce rounding errors. The two rotations are likely there because at some point, that’s what happened to those objects. Certain features in Illustrator will reset the transforms and destructively apply the correct positions (Pathfinder does, I don’t know an extensive list though).

The Transform panel will show you transformations. From there, you can apply the two corrections you’re after.

Illustrator Transform panel

Alternatively, you could hand edit the SVG to remove both transforms, and read the SVG back into Illustrator (please make sure you have Illustrator’s SVG precision set to the maximum number of decimal places when doing so).

| improve this answer | |
  • The objects where not rotated at any stage. This happens when creating a new document, drawing an object and immediately converting it to a symbol. Also, no trace of the rotations is visible in the transform panel. – szymtor May 18 '19 at 13:44

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.