SVG unique gradient name

[loranger]

Hi,

I'm currently experiencing a problem with Affinity Designer: When I export my work in svg in order to import them in a vue.js project, I find myself unable to load several svg in the same component.
After a long search, I've finally managed to isolate the problem: Vite, the Vue bundler, is responsible for optimizing the styles linked to the svg, but it turns out that my images all have a radial gradient and, despite having renamed the layers using unique names, I end up with different gradients all bearing the same id: _Radial1.
How can I uniquely rename the gradients I use in my afdesign files in the same way I rename my layers to avoid name conflicts?

Thanks

[GarryP]

Welcome to the forums @loranger

I don’t think we users have any control over what the gradients are called when exported to SVG.

Can you give us an example AFDESIGN document that we can look at?

Can you also point us to the specific gradients you are having a problem with in that document?

There might not be anything we users can can do about it but someone might have some kind of ‘post-export-fix/workaround’ that you could use.

[loranger]

Thank you @GarryP!

I tried to make a concrete but simple example of my problem.

You cand find a full project on github (if you're into web dev, you just need to clone then run npm install and npm run dev) and the afdesign file resides in the assets folder.

I hope you could understand my issue, and hopefully find a way to avoid this directly inside Affinity Designer.

[GarryP]

Thanks for the extra information.

I don’t think I will be able to help further (I don't think we can do what I think you want to do) but, with the details you have supplied, someone else might have some ideas.

[walt.farrell]

On 1/21/2025 at 3:19 PM, loranger said:

How can I uniquely rename the gradients I use in my afdesign files in the same way I rename my layers to avoid name conflicts?

Other than by editing the text contents of the SVG file manually, I don't think you can. The SVG files produced by Affinity are intended for stand-alone use, not for combining into other files as you're doing.