Jump to content

Recommended Posts

Posted

For the "YOUR" in the text it's due to unnecessary <tspan> in the SVG code shown here ...

tspans.jpg.55d03daf5d080e61713e6e8485fa5312.jpg

... which has splits that text into 3 parts then on export. That text uses a regular MyriadPro font. - The "NAME" text uses instead a bold MyriadPro font and thus is another <text>NAME</text> line here.

In order to fix the first above shown <text>YOUR</text> you can edit it inside an text editor accordingly and remove the <tspan> portion ...

<?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 675 675" 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="0" y="0" width="675" height="675" style="fill:rgb(250,182,0);"/>
    <g transform="matrix(1,0,0,1,0,237.51)">
        <text x="207.316px" y="161.932px" style="font-family:'MyriadPro-Regular', 'Myriad Pro', sans-serif;font-size:50px;fill:rgb(135,43,28);">YOUR</text>
        <text x="336.866px" y="161.932px" style="font-family:'MyriadPro-Bold', 'Myriad Pro', sans-serif;font-weight:700;font-size:50px;fill:rgb(135,43,28);">NAME</text>
    </g>
</svg>

 

☛ 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

Posted

If I remember correctly there's an option in the File > Export dialog, possibly under More..., to reduce the use of the <span> option. I'm not near my computer right now to check.

-- Walt
Designer, Photo, and Publisher V1 and V2 at latest retail and beta releases
PC:
    Desktop:  Windows 11 Pro 23H2, 64GB memory, AMD Ryzen 9 5900 12-Core @ 3.00 GHz, NVIDIA GeForce RTX 3090 

    Laptop:  Windows 11 Pro 23H2, 32GB memory, Intel Core i7-10750H @ 2.60GHz, Intel UHD Graphics Comet Lake GT2 and NVIDIA GeForce RTX 3070 Laptop GPU.
    Laptop 2: Windows 11 Pro 24H2,  16GB memory, Snapdragon(R) X Elite - X1E80100 - Qualcomm(R) Oryon(TM) 12 Core CPU 4.01 GHz, Qualcomm(R) Adreno(TM) X1-85 GPU
iPad:  iPad Pro M1, 12.9": iPadOS 18.3, Apple Pencil 2, Magic Keyboard 
Mac:  2023 M2 MacBook Air 15", 16GB memory, macOS Sequoia 15.0.1

Posted
36 minutes ago, walt.farrell said:

If I remember correctly there's an option in the File > Export dialog, possibly under More..., to reduce the use of the <span> option. I'm not near my computer right now to check.

IMO it might also be font dependent, since if I use Arial as a font instead of MyriadPro the generated SVG result with default SVG settings looks differently ...

Quote

...
 <text x="232.83px" y="163.063px" style="font-family:'ArialMT', 'Arial', sans-serif;font-size:12px;">YOUR</text>
 <text x="270.834px" y="163.063px" style="font-family:'Arial-BoldMT', 'Arial', sans-serif;font-weight:700;font-size:12px;">NAME</text>
...

... vs ...

Quote

...
<text x="232.83px" y="163.063px" style="font-family:'MyriadPro-Regular', 'Myriad Pro', sans-serif;font-size:12px;">Y<tspan x="238.89px " y="163.063px ">O</tspan>UR</text>
<text x="263.922px" y="163.063px" style="font-family:'MyriadPro-Bold', 'Myriad Pro', sans-serif;font-weight:700;font-size:12px;">NAME</text>
...

Other than that, when using under the SVG more options "Longer text spans [x]" it will be Ok ...

Quote

<text x="232.83px" y="163.063px" style="font-family:'MyriadPro-Regular', 'Myriad Pro', sans-serif;font-size:12px;">YOUR</text>
 <text x="263.922px" y="163.063px" style="font-family:'MyriadPro-Bold', 'Myriad Pro', sans-serif;font-weight:700;font-size:12px;">NAME</text>

 

For the OP, take a look into the Online Help and the Export settings there for the SVG format.

svg-settings.jpg.a25646ec27d7605499ec231f8022bfb7.jpg

 

☛ 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

Posted

It helps... thx.

But one more thing... There is some graphic, its a line with stroke 0,7 points.
When I save it to SVG and open in Illustrator, stroke is changed to 4,78 points.

Any idea where might be problem?
Browser, like Firefox shows stroke correctly.

 

Thx.

Posted
2 hours ago, roman116 said:

But one more thing... There is some graphic, its a line with stroke 0,7 points.
When I save it to SVG and open in Illustrator, stroke is changed to 4,78 points.

Any idea where might be problem?

Sounds strange, since I don't use Illustrator I can't tell you if it maybe scales things up here then. You can look at the generated default SVG boundingBox settings, if that maybe gives that behavior in Illustrator then. Aka ...

Quote

<svg width="100%" height="100%" viewBox="0 0 800 600"

... vs ...

<svg width="800 px" height="600 px" viewBox="0 0 800 600"

☛ 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

Posted

I found another problem with SVG.

I created some graphic, solved problem with the fonts and saved as SVG.

However when I open this SVG in Illustrator, some graphics has problem with strokes of the lines and also dimensions of the graphic are different.
It looks like Illustrator does not read or cannot read information about dimensions of the canvas.

The proportions are correct.
But the overall size is wrong.
If I set the artboard size in illustrator exactly as I have it in Affinity, and put place instead of open, illustrator opens the SVG at the correct size.

It's just that nobody will know the overall size, and most people will just open the SVG and wonder what the weird dimensions are.

Anyone has any advise how to solve this?
I mean different one then to go back to Illustrator :)

Posted

Didn't you read my above comment about the boundingBox settings? - Did you looked above into the OnlineHelp about SVG export?

setViewbox.jpg.f6ad65f57a4e092781c8348ef6552b3f.jpg

Take a look at that and follow the shown link in order to understand what settings do make what differences. Further you can show your generated Affinity and SVG files here, so forum cominity users can take a look at those and maybe then can tell you more concrete things about what might be the cause!

☛ 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

Posted

Yes I did, I check these options, but right now I am not sure what was original settings... I stuck with these things for quite a long time.
right now, when I reopen SVG back to Affinity, I can see objects bleeding from document out. There were masks originally...

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.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
×
×
  • Create New...

Important Information

Terms of Use | Privacy Policy | Guidelines | We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.