1 Attachment(s)
How to get clean SVG exports?
A clean svg file looks something like:
HTML Code:
<svg width="24" height="24" xmlns="http://www.w3.org/2000/svg" fill-rule="evenodd" clip-rule="evenodd"><path d="M22 13c-.027-5.497-4.497-10-10-10s-9.973 4.503-10 10h2.5c.828 0 1.5.672 1.5 1.5v7c0 .828-.672 1.5-1.5 1.5h-3c-.828 0-1.5-.672-1.5-1.5v-8.5c.027-6.601 5.394-12 12-12s11.973 5.399 12 12v8.5c0 .828-.672 1.5-1.5 1.5h-3c-.828 0-1.5-.672-1.5-1.5v-7c0-.828.672-1.5 1.5-1.5h2.5z"/></svg>
How can I achieve this clean export in Xara? Xara adds backgrounds, doctypes, comments, xml data, unnecessary shadows(?), spammy group layers etc.
Attachment 132640
The above image exported as an svg resolves to:
HTML Code:
<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<!--Generator: Xara Designer (www.xara.com), SVG filter version: 6.1.0.18-->
<svg stroke-width="0.501" stroke-linejoin="bevel" fill-rule="evenodd" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg" version="1.1" overflow="visible" width="206.517pt" height="211.049pt" viewBox="0 0 206.517 211.049">
<defs>
<image id="Bitmap" preserveAspectRatio="none" width="1" height="1" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAdAAAAEdCAYAAAC8KzZqAAAACXBIWXMAAA7DAAAOwwHHb6hkAAACGElEQVR4nO3BMQEAAADCoPVPbQo/IAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA4KEGE9UAAfny2zMAAAAASUVORK5CYII=">
<title>1</title>
</image>
</defs>
<g id="Document" fill="none" stroke="black" font-family="Times New Roman" font-size="16" transform="scale(1 -1)">
<g id="Spread" transform="translate(0 -211.049)">
<g id="Page background">
<use transform="translate(-1.431 213.069) scale(348 -213.75)" xlink:href="#Bitmap" stroke-width="0" fill="none" stroke="none" stroke-miterlimit="79.8403193612775"/>
<g id="Shadow" stroke="none" stroke-width="0" stroke-miterlimit="79.8403193612775">
<path d="M -0.001,211.048 L -0.001,-0.001 L 206.516,-0.001 L 206.516,211.048 L -0.001,211.048 Z" marker-start="none" marker-end="none"/>
</g>
</g>
<g id="Layer 1">
<g id="Group" fill-rule="evenodd" stroke-linejoin="miter" stroke="none" stroke-width="0.037" fill="#000000" stroke-miterlimit="79.8403193612775">
<g id="Group_1">
<g id="Group_2">
<path d="M 71.031,-0.403 C 69.498,0.218 67.891,2.519 65.444,7.631 C 60.769,17.273 57.409,21.619 46.526,31.881 C 33.051,44.626 26.623,51.346 23.738,55.655 C 17.055,65.735 12.49,78.48 10.773,91.993 C 9.568,101.488 9.897,100.465 8.034,101.451 C 5.77,102.693 2.958,105.615 1.351,108.354 L 0,110.654 L 0,154.515 L 0,198.376 L 1.315,200.713 C 4.748,206.885 9.897,209.514 17.749,209.149 C 21.839,208.93 23.994,208.017 27.463,205.095 C 28.778,203.963 29.946,203.014 30.056,203.014 C 30.129,203.014 32.758,204.474 35.899,206.227 C 43.167,210.391 44.664,210.865 49.85,210.829 C 58.724,210.792 63.545,207.688 67.416,199.544 C 70.118,193.847 71.324,188.369 71.981,178.545 C 72.821,165.69 71.36,154.223 67.781,145.75 C 64.056,136.912 57.921,132.895 48.754,133.37 C 44.554,133.553 43.276,134.027 37.068,137.46 L 33.051,139.724 L 32.795,127.636 C 32.685,120.99 32.466,114.526 32.32,113.284 C 31.845,108.865 28.303,103.789 24.213,101.744 C 22.715,100.977 22.387,100.648 22.496,99.954 C 22.569,99.479 22.788,97.726 23.044,96.01 C 24.213,87.391 26.988,77.823 30.275,70.994 C 33.927,63.471 35.899,61.17 54.743,42.325 C 69.351,27.754 71.47,25.051 76.765,14.497 C 79.468,9.129 79.76,8.362 79.906,6.025 C 80.198,1.204 78.518,-0.768 74.136,-0.732 C 72.821,-0.732 71.433,-0.586 71.031,-0.403 Z" marker-start="none" marker-end="none"/>
<path d="M 129.829,-0.147 C 129.427,-0.038 128.697,0.4 128.258,0.802 C 125.337,3.505 125.702,6.938 129.865,15.666 C 134.941,26.293 137.936,29.836 160.542,51.857 C 167.116,58.285 169.051,60.403 170.987,63.361 C 175.223,69.716 178.108,76.143 180.263,83.958 C 181.687,89.071 183.44,99.078 183.111,100.1 C 183.002,100.465 181.76,101.524 180.372,102.474 C 177.67,104.227 175.442,106.783 174.383,109.34 C 173.799,110.837 173.214,120.99 172.995,134.429 L 172.922,139.834 L 169.453,137.825 C 163.865,134.612 160.798,133.553 156.488,133.333 C 153.238,133.187 152.508,133.297 149.988,134.137 C 142.501,136.657 138.52,141.587 135.854,151.776 C 132.422,164.923 132.823,183.549 136.804,195.527 C 138.301,200.019 140.127,203.306 142.611,205.789 C 146.226,209.441 150.243,211.048 155.685,211.048 C 160.286,211.048 162.441,210.245 171.352,205.314 L 175.661,202.941 L 177.56,204.657 C 181.358,208.09 184.207,209.222 189.028,209.222 C 196.587,209.222 201.737,206.191 205.243,199.727 L 206.521,197.353 L 206.521,154.625 C 206.521,121.245 206.411,111.567 206.046,110.362 C 205.425,108.281 202.723,104.738 200.422,102.985 C 199.363,102.182 198.121,101.232 197.646,100.867 C 196.953,100.283 196.733,99.516 196.113,94.586 C 193.921,78.006 190.123,67.05 182.71,55.838 C 179.569,51.127 173.58,44.882 160.652,32.867 C 153.384,26.111 148.856,21.253 146.336,17.528 C 145.569,16.396 143.56,12.708 141.844,9.311 C 137.534,0.802 137.279,0.474 135.088,-0.001 C 133.225,-0.403 131.143,-0.476 129.829,-0.147 Z" marker-start="none" marker-end="none"/>
</g>
</g>
</g>
</g>
</g>
</g>
</svg>
Edit: Hiding the page background does to remove the shadow however there is still a lot of other junk in the export.
How am I able to achieve minimalist, truly clean exports?
Kind regards
Jack
Re: How to get clean SVG exports?
Jack the Export as SVG is trying to be as compatible as possible for older graphics packages.
You are also using a version 12 product from your entered TG account details.
In XPro+ and those applications that now handle SVG rendering, you can Preview and extract the pure SVG from the browser's Dev Tools > Elements view.
If you don't have SVG rendering yet, you can use https://svgomg.netlify.app.
Acorn
2 Attachment(s)
Re: How to get clean SVG exports?
Filetoolarge, I'm not 100% what your problem is here and it would be of great help to view your xar/web file to comment further.
One thing I notice that your screenshot includes a shadow group. Unless there's been any recent changes, which I don't believe there has, Xara exports shadows as bitmaps. Not ideal if you're working in vector shapes.
So if you want to create shadows using Xara's shadow tool you're better off using the old fashioned Xara way to create shadows or other svg software that can create vector shadows (& blurs etc)
I attach a xar file that only creates vector shapes but as I'm not totally understanding your goal I may be way off target ;)
Re: How to get clean SVG exports?
Quote:
Originally Posted by
Acorn
Jack the Export as SVG is trying to be as compatible as possible for older graphics packages.
You are also using a version 12 product from your entered TG account details.
In XPro+ and those applications that now handle SVG rendering, you can Preview and extract the pure SVG from the browser's Dev Tools > Elements view.
If you don't have SVG rendering yet, you can use
https://svgomg.netlify.app.
Acorn
A-Ha. That svg rendering link is perfect for what I need - thank you.
The only data I really needed in the original svg export was the data in #Group_2 but it's plugged in extra layers of groupings which I am unable to stop from Xara Designer X Pro 12 exports.
Not much of a fan with updating software. I have never looked back from using Xara and have always recommended it to others for the past 13 years. I did look at updating at one point but what I have is essentially perfection for me now.
Thanks again
Re: How to get clean SVG exports?
Quote:
Originally Posted by
Egg Bramhill
Filetoolarge, I'm not 100% what your problem is here and it would be of great help to view your xar/web file to comment further.
One thing I notice that your screenshot includes a shadow group. Unless there's been any recent changes, which I don't believe there has, Xara exports shadows as bitmaps. Not ideal if you're working in vector shapes.
So if you want to create shadows using Xara's shadow tool you're better off using the old fashioned Xara way to create shadows or other svg software that can create vector shadows (& blurs etc)
I attach a xar file that only creates vector shapes but as I'm not totally understanding your goal I may be way off target ;)
That's really smart how you added a blend to create vector shadows.
Definitely food-for-thought in the future.
Thank you for the advise
