Search the Community

Hi, Love Affinity Designer. This is an issue when importing SVG files. In SVG, a common method for centreing text in a box is to use percentage values for X and Y attributes of the <text> element. The same method also uses the "dominant-baseline" attribute. See the small enclosed example to show the technique. It is unfortunate that SVGs that use these attributes do not currently import into AD correctly (but do import into browsers and Inkscape correctly). The text is not centred in the box at all. centre.svg It would be a useful enhancement to support these attributes. Perhaps this one could be quick/fairly easy to resolve, knocking another issue off the list?

Are you using the latest release version? YES 1.10.5.1342 Can you reproduce it? YES Does it happen for a new document? If not can you upload a document that shows the problem? Doc included If you cannot provide a sample document then please give an accurate description of the problem for example it should include most of the following: What is your operating system and version (Windows 10, OSX Mojave, iOS 12 etc)? Windows 10.0.1.19043 Is hardware acceleration (in Preferences > Performance) ON or OFF ? (and have you tried the other setting?) tried OFF and ON What happened for you (and what you expected to happen) The importation of text in an SVG does not properly support the alignment-baseline attribute and my text is placed at the wrong Y coordinate Provide a recipe for creating the problem (step-by-step what you did). The SVG that I have placed at the bottom of this message does not import correctly into Photo, Publisher or Designer. The Y coordinate is in the wrong place Screenshots (very handy) or a screen capture/video. Attached SVG Source code: <svg width="612" height="792" viewBox="0 0 612 792" xmlns="http://www.w3.org/2000/svg"> <rect x="0" y="0" width="612" height="792" fill="#FFFFFF" stroke="#000000" stroke-width="1"/> <rect x="36" y="36" width="36" height="36" fill="#DDDDFF" stroke="#000066" stroke-width="1"/> <path d="M 36 36 L 100 160 Q 130 200 150 120 C 190 -40 200 200 300 150 L 400 90 z" fill="none" stroke="black" stroke-width="2"/> <path d="M 100 100 L 200 100 L 150 200 z" fill="white" stroke="#00FFFF" stroke-width="1"/> <text x="36" y="36" alignment-baseline="hanging" font-family="Times New Roman" font-size="48" font-weight="bold" fill="red">This is a test!</text> <text x="36" y="36" alignment-baseline="hanging" font-family="Times New Roman" font-size="24" font-weight="bold" fill="green">This is a test!</text> <text x="36" y="36" alignment-baseline="hanging" font-family="Times New Roman" font-size="12" font-weight="bold" fill="blue">This is a test!</text> </svg> I have tested all of the alignment-baseline values and found several where your apps do not follow the rules. I am including several images that show the SVG in Chrome, Edge and Firefox as well as in Designer. (To test the different values change the value of alignment-baseline="hanging" to the each entry in the list of failing options at the end of this message) I will add that Firefox also seems to import these incorrectly. I have also tested these SVGs in Photo and Publisher and I assume you have the same import code for all three since they do the same things. Here is the link that describes how alignment-baseline is supposed to work https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/alignment-baseline List of values that are failing: mathematical hanging central text-before-edge middle baseline There may be others that depend on parent relationships, but this SVG does not dive that deep. Mike Collins CENTRAL HANGING MATHEMATICAL MIDDLE TEXT-BEFORE-EDGE

The SVG file of the Antarctic Treaty Flag is wrongly imported. I hope that the SVG file itself is correct (another program has problems with the file) but on the browser and Inkscape or GraphicConverter correctly visualise the flag. You can find the file here (; correctly rendered in my browser) or in the attachment. Regards, Hardy Flag_of_the_Antarctic_Treaty.svg

Hello, Dev team i have trying to do changes on SVG file screen behaviour is wiggly every time, when i have select the curve tool pan zoom in and out also SVG Export feature have missing these Properties. Css properties Style elements Present attribute Style attributes Style attributes (Entity references) This can help to web designer to export style standers Thanks