Juc1 Posted November 26, 2022 Share Posted November 26, 2022 Hi all I have attached a simple file as an example - in Designer 2 I have three layers with font text, one layer with a rectangle and no groups. When I export the file to SVG it seems that I have an empty group for each text layer. The SVG file displays ok in the browser but I don't want useless clutter in my SVG files. Can anyone please tell me why am I getting these empty groups or how can I stop them? <?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 400 200" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;"> <rect x="50" y="20" width="50" height="50" style="fill:rgb(13,202,242);"/> <g transform="matrix(50,0,0,50,310.289,181.133)"> </g> <text x="124.058px" y="181.133px" style="font-family:'ArialMT', 'Arial', sans-serif;font-size:50px;">Houston</text> <g transform="matrix(50,0,0,50,249.972,116.383)"> </g> <text x="94.308px" y="116.383px" style="font-family:'ArialMT', 'Arial', sans-serif;font-size:50px;">Boston</text> <g transform="matrix(50,0,0,50,257.422,55.791)"> </g> <text x="46.191px" y="55.791px" style="font-family:'ArialMT', 'Arial', sans-serif;font-size:50px;">New <tspan x="159.204px 187.964px 215.771px " y="55.791px 55.791px 55.791px ">Yor</tspan>k</text> </svg> text-test-261122.afdesign Quote Link to comment Share on other sites More sharing options...
Old Bruce Posted November 26, 2022 Share Posted November 26, 2022 I am not sure what you mean by empty text layers. You have the words New York and Boston and Houston in the SVG file. Quote Mac Pro (Late 2013) Mac OS 12.7.4 Affinity Designer 2.4.1 | Affinity Photo 2.4.1 | Affinity Publisher 2.4.1 | Beta versions as they appear. I have never mastered color management, period, so I cannot help with that. Link to comment Share on other sites More sharing options...
Juc1 Posted November 26, 2022 Author Share Posted November 26, 2022 1 minute ago, Old Bruce said: I am not sure what you mean by empty text layers. You have the words New York and Boston and Houston in the SVG file. I mean the g (group) elements are empty see below for example - the group opens and then closes with nothing inside it - also as you can see in my AD screenshot I have no groups in the layers panel so where are these groups coming from? <g transform="matrix(50,0,0,50,310.289,181.133)"> </g> Quote Link to comment Share on other sites More sharing options...
Palatino Posted November 26, 2022 Share Posted November 26, 2022 29 minutes ago, Juc1 said: so where are these groups coming from? Quote Thanks to DeepL. Link to comment Share on other sites More sharing options...
Brian_J Posted November 26, 2022 Share Posted November 26, 2022 @Palatino When I save the file with Flatten transforms disabled, I still get empty groups. Quote Windows 10 22H2, 32GB RAM | Affinity Designer, Photo, Publisher 2 (MSI/EXE) Link to comment Share on other sites More sharing options...
François R Posted November 26, 2022 Share Posted November 26, 2022 Just now, Brian_J said: @Palatino When I save the file with Flatten transforms disabled, I still get empty groups. Yep: Quote 1) You have completely wrecked the layers panel, Serif. 2) I recommend Reddit groups instead of this forum. Not the same few bot-like users replying to everything, a wider representation of users, fewer fanboys, more qualified users. In short, better! 3) I was here to report bugs and submit improvement requests for professional work professionally in a large setup and to bring a lot of knowledge from the world, i.e. professional product development, web- and software development, usability, user experience design and accessibility. I actually know what I am talking about! BUT! We are phasing out Designer and Affinity in 2022 Q1 - and replacing it with feature complete and algorithmically competent alternatives. Publisher is unsuitable for serious use, and was never adopted. Link to comment Share on other sites More sharing options...
Juc1 Posted November 26, 2022 Author Share Posted November 26, 2022 Just now, Brian_J said: @Palatino When I save the file with Flatten transforms disabled, I still get empty groups. Yes you can see in my original screenshot above that "Flatten transforms" is already checked. Quote Link to comment Share on other sites More sharing options...
Palatino Posted November 26, 2022 Share Posted November 26, 2022 1 minute ago, Juc1 said: Yes you can see in my original screenshot above that "Flatten transforms" is already checked. Yes, I overlooked that. Designer V1: <?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 400 200" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;"> <rect x="50" y="20" width="50" height="50" style="fill:rgb(13,202,242);"/> <text x="124.058px" y="181.133px" style="font-family:'ArialMT', 'Arial', sans-serif;font-size:50px;">Houston</text> <text x="94.308px" y="116.383px" style="font-family:'ArialMT', 'Arial', sans-serif;font-size:50px;">Boston</text> <text x="46.191px" y="55.791px" style="font-family:'ArialMT', 'Arial', sans-serif;font-size:50px;">New <tspan x="159.204px 187.963px 215.771px " y="55.791px 55.791px 55.791px ">Yor</tspan>k</text> </svg> Quote Thanks to DeepL. Link to comment Share on other sites More sharing options...
Juc1 Posted November 26, 2022 Author Share Posted November 26, 2022 5 minutes ago, Palatino said: Yes, I overlooked that. Designer V1: <?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 400 200" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;"> <rect x="50" y="20" width="50" height="50" style="fill:rgb(13,202,242);"/> <text x="124.058px" y="181.133px" style="font-family:'ArialMT', 'Arial', sans-serif;font-size:50px;">Houston</text> <text x="94.308px" y="116.383px" style="font-family:'ArialMT', 'Arial', sans-serif;font-size:50px;">Boston</text> <text x="46.191px" y="55.791px" style="font-family:'ArialMT', 'Arial', sans-serif;font-size:50px;">New <tspan x="159.204px 187.963px 215.771px " y="55.791px 55.791px 55.791px ">Yor</tspan>k</text> </svg> Yeah that is how I would expect the SVG file to look - so it looks like a V2 bug ? Quote Link to comment Share on other sites More sharing options...
Palatino Posted November 26, 2022 Share Posted November 26, 2022 1 minute ago, Juc1 said: so it looks like a V2 bug ? Yes. The transformation is resolved correctly, but then the transformation group is not deleted. Quote Thanks to DeepL. Link to comment Share on other sites More sharing options...
Brian_J Posted November 26, 2022 Share Posted November 26, 2022 I agree... bug. I created a new file, saved it in Designer v1 and v2, and got the same results as @Palatino — v1 code is clean, v2 has the empty groups. Palatino 1 Quote Windows 10 22H2, 32GB RAM | Affinity Designer, Photo, Publisher 2 (MSI/EXE) Link to comment Share on other sites More sharing options...
Palatino Posted November 26, 2022 Share Posted November 26, 2022 18 minutes ago, Brian_J said: v1 code is clean, Well, it could be a bit nicer: 😉 <?xml version="1.0" encoding="utf-8"?> <svg clip-rule="evenodd" fill-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="2" viewBox="0 0 400 200" xmlns="http://www.w3.org/2000/svg"> <rect fill="#0dcaf2" height="50" width="50" x="50" y="20"/> <g font-family="ArialMT, Arial, sans-serif" font-size="50"> <text x="124.06" y="181.13">Houston</text> <text x="94.308" y="116.383">Boston</text> <text x="46.191" y="55.791">New York</text> </g> </svg> Brian_J 1 Quote Thanks to DeepL. Link to comment Share on other sites More sharing options...
Brian_J Posted November 26, 2022 Share Posted November 26, 2022 2 minutes ago, Palatino said: Well, it could be a bit nicer: 😉 Indeed! 👍 Let me rephrase that... The v1 code doesn't have empty groups, but still needs some work. 🙂 Quote Windows 10 22H2, 32GB RAM | Affinity Designer, Photo, Publisher 2 (MSI/EXE) Link to comment Share on other sites More sharing options...
Juc1 Posted November 26, 2022 Author Share Posted November 26, 2022 On a side note re my original screenshot above why does Designer break up words like "New York" into "New", "Yor" and "k" - which then need multiple x y coordinates? I know this can be turned off in svg export options with longer text spans but what is the benefit / point of doing it, why is breaking up words even an option? why would anyone want words broken up in their SVG? Quote Link to comment Share on other sites More sharing options...
Old Bruce Posted November 27, 2022 Share Posted November 27, 2022 19 hours ago, Juc1 said: On a side note re my original screenshot above why does Designer break up words like "New York" into "New", "Yor" and "k" - which then need multiple x y coordinates? Could be due to some kerning applied in the original. Quote Mac Pro (Late 2013) Mac OS 12.7.4 Affinity Designer 2.4.1 | Affinity Photo 2.4.1 | Affinity Publisher 2.4.1 | Beta versions as they appear. I have never mastered color management, period, so I cannot help with that. Link to comment Share on other sites More sharing options...
GarryP Posted February 15 Share Posted February 15 This thread got a bit ‘off track’ near the end, before I 'resurrected' it, but I’m wondering if this needs a bug report creating for it. I’ve noticed that I sometimes find ‘superfluous’ groups with transform attributes in the exported SVGs. For example, in Designer, I can create a new document, add some Artistic Text, move the text and then export the document to SVG. When I do this I get the following SVG: <?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 1920 1080" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;"> <g transform="matrix(1,0,0,1,609.969,481.812)"> <g transform="matrix(385.309,0,0,385.309,1175.72,428)"> </g> <text x="191px" y="428px" style="font-family:'ArialMT', 'Arial', sans-serif;font-size:385.309px;">TEXT</text> </g> </svg> Note the group which contains a transform attribute but has no contents. If I set “Flatten Transforms” ON in the export settings (Export Dialog) I get this: <?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 1920 1080" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;"> <g transform="matrix(385.309,0,0,385.309,1785.69,909.812)"> </g> <text x="800.969px" y="909.812px" style="font-family:'ArialMT', 'Arial', sans-serif;font-size:385.309px;">TEXT</text> </svg> ...which still has a strange ‘transformed but empty' group. I think this needs reporting as a bug, which I can do if necessary, unless someone can give a good explanation for what’s happening. Quote Link to comment Share on other sites More sharing options...
Juc1 Posted February 15 Author Share Posted February 15 @GarryP yeah that is the same problem I mentioned above = creating garbage / phantom HTML so yeah I would call it a bug. Quote Link to comment Share on other sites More sharing options...
v_kyr Posted February 15 Share Posted February 15 1 hour ago, Juc1 said: @GarryP yeah that is the same problem I mentioned above = creating garbage / phantom HTML so yeah I would call it a bug. That's XML code (XML format) so not to mixup with HTML. No Affinity app generates HTML code so far. 2 hours ago, GarryP said: but I’m wondering if this needs a bug report creating for it. That is already known very long time and thus possibly might have an internal bug or tracking number! - But in order to get sure it get's looked after, I would report it (even again). Quote ☛ Affinity Designer 1.10.8 ◆ Affinity Photo 1.10.8 ◆ Affinity Publisher 1.10.8 ◆ OSX El Capitan ☛ Affinity V2.3 apps ◆ MacOS Sonoma 14.2 ◆ iPad OS 17.2 Link to comment Share on other sites More sharing options...
Juc1 Posted February 15 Author Share Posted February 15 51 minutes ago, v_kyr said: That's XML code (XML format) so not to mixup with HTML. No Affinity app generates HTML code so far. OK thanks so SVG is an HTML tag but the content of the SVG tag / file (ie as seen on the page source of a web page) is XML. Quote Link to comment Share on other sites More sharing options...
v_kyr Posted February 15 Share Posted February 15 1 hour ago, Juc1 said: OK thanks so SVG is an HTML tag but the content of the SVG tag / file (ie as seen on the page source of a web page) is XML. Yes, as can be also seen by/in the SVG header generated by Affinity apps... Quote <?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"> ... ... Note however, that there are several ways to embed SVG into HTML, seven of those are shown here (you may have to use a web translator in order to translate this in german written site entry) ... Sieben Wege, SVG in HTML-Seiten zu setzen (german) Seven ways to put SVG in HTML pages (translated to english) Quote ☛ Affinity Designer 1.10.8 ◆ Affinity Photo 1.10.8 ◆ Affinity Publisher 1.10.8 ◆ OSX El Capitan ☛ Affinity V2.3 apps ◆ MacOS Sonoma 14.2 ◆ iPad OS 17.2 Link to comment Share on other sites More sharing options...
GarryP Posted February 16 Share Posted February 16 Reported as a bug here: https://forum.affinity.serif.com/index.php?/topic/198524-svg-export-can-contain-‘superfluous’-transformed-but-empty-groups/ Juc1 and v_kyr 2 Quote Link to comment Share on other sites More sharing options...
Juc1 Posted February 16 Author Share Posted February 16 14 hours ago, v_kyr said: Yes, as can be also seen by/in the SVG header generated by Affinity apps... Note however, that there are several ways to embed SVG into HTML, seven of those are shown here (you may have to use a web translator in order to translate this in german written site entry) ... Sieben Wege, SVG in HTML-Seiten zu setzen (german) Seven ways to put SVG in HTML pages (translated to english) Ah interesting - I mostly use #3 Write SVG directly into the HTML markup - so I can target for animation. Quote Link to comment Share on other sites More sharing options...
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.