Opening these SVG do not show anything

[jrmgx]

I'm a new user of Affinity Designer and I'm wondering why those SVG do not show anything when opened?

They work in Firefox.

Let me know what should I do?

Visiwig-Chevron-Alternates copie.svg Visiwig-Chevron-Alternates.svg

[Sean P]

Hi jrmgx,

Thanks for letting us know - I've passed this over to development to be investigated.

[jrmgx]

Thank you for the reply,

note, it does not have to be fixed right away, I can imagine it's a heavy process to do so, but I'd love to know as soon as you know what is wrong in those images and how I can fix them, so I can open them.

Have a good day

[markw]

Out of curiosity I opened these files in Designer and they contained in each just two rectangle layers, each layer only being 1 x 1px in size hiding in the top left corners.
One layer has the yellow fill and the other no fill at all?
Curious… Did you download these from an SVG site?

[Old Bruce]

1 hour ago, markw said:

Out of curiosity I opened these files in Designer and they contained in each just two rectangle layers, each layer only being 1 x 1px in size hiding in the top left corners.
One layer has the yellow fill and the other no fill at all?
Curious… Did you download these from an SVG site?

Hmmm, I saw Yellow and Black. Both being 1px x 1px.

[jrmgx]

Hello to both of you,

I got those files from https://www.visiwig.com/patterns/
Note that they do show something in Google Chrome or Firefox, they are valid SVGs

But you're right, when open in Designer they show only weird rectangle layers.
Probably because they (in the SVG code) only define a pattern and use that to fill a rectangle

Well, I'd love to have those file working, so I can use it for my project in Design

[Hangman]

Seems to have been an issue since AD's inception. A fix was 'promised' way back in 2015 but seemingly still no dice!

 

[jrmgx]

Please, I paid that software because I thought it was good, and now I can't do what I want,
let me know how I can open those SVGs

[Hangman]

The simple fact is that currently the Affinity suite doesn’t support SVG Pattern Fills. My basic understanding of SVG pattern fills is that they are intended for use as scaleable backgrounds for web pages (hence the browser support) so it sort of doesn’t surprise me that Affinity doesn’t support them, though having said that other software such as Illustrator and even the free Inkscape do (so hopefully Affinity will in the future).

I would say you have two options if you want to use these specific patterns:

Option 1

Create them yourself directly in designer as they are fundamentally basic repeating patterns and can be created quickly and easily. I realise this kind of defeats the objective of using ready made patterns but it really is quick to do, especially for the simple patterns like the chevrons.

Option 2

Make your scale, stroke and colour adjustments first using the interactive sliders on visiwig.com and then save the SVG file. Convert the SVG file to an EPS file using an application like Illustrator or Inkscape (EPS is the only option that maintains the elements/shapes in an editable vector format, NB: PDF rasterises the pattern fill and as such it is non editable).

Alternatively use an online conversion tool such as https://convertio.co/ to convert from SVG to EPS. The EPS file will then open in Designer. From there you can tidy the file up by removing the clipping paths from each layer together with any duplicated layers.

Once you have either created from scratch or tidied up the converted EPS file you can then store this as a symbol in Designer if the intention is to produce a repeating pattern. This has the benefit of being able to edit the fill and/or stroke colour as required 'once' to change the entire repeating pattern.

Maybe @Sean P can update us as to whether SVG vector pattern fills are on the roadmap for future inclusion?