Ariano Posted January 8, 2020 Posted January 8, 2020 Hello guys, I bought Affinity Designer to do web related work. Basically, I use it to create and export files, mostly SVGs when working with vectors. The idea is, exporting the SVG, taking the SVG code and paste it in the HTML code so we can mess around with the SVG coloring with mouse hovers, etc. The problem is, for multiple times the SVG code exported from Affinity doesn't work right. Sometimes the SVG are cut in a small portion, bugged in some browsers like Safari, etc. Which it's a pain because I used Illustrator for this and the codes generated by it always worked fine. Quote
Staff Sean P Posted January 8, 2020 Staff Posted January 8, 2020 Hi Ariano, Can you try and be more specific about the issues you are seeing. If possible please attach the offending AFDesign files you are exporting, your SVG export settings, and also what you feel is wrong in the SVG when opened? Have you tried adjusting the SVG export settings to see if they allow you to export files to how you require them. Quote
Ariano Posted January 8, 2020 Author Posted January 8, 2020 6 hours ago, Sean P said: Hi Ariano, Can you try and be more specific about the issues you are seeing. If possible please attach the offending AFDesign files you are exporting, your SVG export settings, and also what you feel is wrong in the SVG when opened? Have you tried adjusting the SVG export settings to see if they allow you to export files to how you require them. Hello, sorry I can't send the files since it's confidential work. I tried using the default settings and after tweaking it a little the SVG was broken. If you open the SVG file itself it works fine, the problem is when I copy the code from the SVG to paste it in HTML. It looks like the clip-path it's all wrong and a small part of the svg gets cut. Quote
Staff Sean P Posted January 9, 2020 Staff Posted January 9, 2020 There are some known issues regarding SVGs using the clip-path attribute, so it is likely to be that which you are encountering. Quote
tbuske Posted January 9, 2020 Posted January 9, 2020 I also have problems with exporting svg. I hoped it was on my site, but now iam convinced that svg export is buggy. The problem, i use it for my thesis and the time is running out more and more. Here is my situation: Rectangles are streched when resized. No Fill, 0,5pt stroke I made two boxes at the bottom, one is shorter and the strokes are streched bigger/thinner. See attachment Anschlusslayout_SZM_X-ACT.svg Quote
Staff Sean P Posted January 10, 2020 Staff Posted January 10, 2020 Hi tbuske, Could you also attach the source AFDesign file you're exporting to SVG along with your export settings please? Without these we cannot attempt to reproduce or understand what the issue is. Thanks, Quote
tbuske Posted January 10, 2020 Posted January 10, 2020 Ok here is a file where you can see, all lines should be 0,5pt but they differ in svg like crazy. Version is 1.7.3.481 on Win 10 Export: SVG (for export) SVG-Test.afdesign SVG-Test.svg Quote
tbuske Posted January 10, 2020 Posted January 10, 2020 Also, when i create vector images the .afdesign is just a few kB just like it should but if i create a new file and copy a design to the new file the filesize gets huge. Like here, the filesize is now 1372 kB. The orignal filesize with 3 more Artboards just takes 130 kB. But that is a complete different problem, just to let you know. Quote
Staff Sean P Posted January 13, 2020 Staff Posted January 13, 2020 Hi tbuske, If you select 'Flatten Transforms' in the SVG Export dialog it will remove the Group element containing the transforms which is causing the objects to be clipped and appear as varying levels of stroke width. Regarding the file size, I copied all your objects into a new document and that created a much smaller file (21kb), I was not able to reproduce the large file size you are seeing. Quote
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.