SVG Export - Unnecessary g transforms

[matt.baker]

Why does Affinity insert unnecessary transforms when exporting as SVG?

 

With the example document, the SVG export gives:

<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg width="100%" height="100%" viewBox="0 0 12 11" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:1.41421;">
    <g transform="matrix(0.8,0,0,0.916667,-446.4,-374)">
        <rect x="558" y="408" width="15" height="12" style="fill:rgb(235,235,235);"/>
    </g>
    <g transform="matrix(1,0,0,1,-561,-409)">
        <path d="M567,411.501L569.499,416.499L564.501,416.499L567,411.501Z" style="fill:rgb(153,153,153);"/>
    </g>
</svg>

This can be simplified to:

<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg width="100%" height="100%" viewBox="0 0 12 11" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:1.41421;">
    <rect x="0" y="0" width="12" height="11" style="fill:rgb(235,235,235);"/>
    <path d="M6,2.501L8.499,7.499L3.501,7.499L6,2.501Z" style="fill:rgb(153,153,153);"/>
</svg>

The original seems an overly complicated way of doing it.

Up arrow.afdesign

Up arrow Affinity.svg

Up arrow Modified.svg

[MattP]

Here's what I get when I go to Export SVG and hit the 'More' button and specify 'Flatten transforms':

<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg width="100%" height="100%" viewBox="0 0 12 11" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:1.41421;">
    <rect x="0" y="0" width="12" height="11" style="fill:rgb(235,235,235);"/>
    <path d="M6,2.501L8.499,7.499L3.501,7.499L6,2.501Z" style="fill:rgb(153,153,153);"/>
</svg>

You can just use this if you'd prefer :)

 

We're trying to write out as much of the information in your document as possible. Not everybody wants the same things from their SVG export which is why the option is there... Imagine the case where you were intending to script that Rectangle movement from its original location to the new destination - that transform and <g> would actually come in useful.

 

Thanks,

Matt

[matt.baker]

Thanks for the explanation and tip, Matt. That clears things up.

I guess it kept the metadata for the two elements from the original document when I pasted them into a new document.