duplicate generated linearGradient id in symbol mode
See original GitHub issueConsider two icons with linear gradient and each gradient having its own unique id. for example:
bike.svg:
<linearGradient id="BIKE_1" ... > ... </linearGradient>
<linearGradient id="BIKE_2" ... > ... </linearGradient>
<linearGradient id="BIKE_3" ... > ... </linearGradient>
...
<path fill="url(#BIKE_1)" ... />
<path fill="url(#BIKE_2)" ... />
<path fill="url(#BIKE_3)" ... />
and second icon:
car.svg:
<linearGradient id="CAR_1" ... > ... </linearGradient>
<linearGradient id="CAR_2" ... > ... </linearGradient>
<linearGradient id="CAR_3" ... > ... </linearGradient>
...
<path fill="url(#CAR_1)" ... />
<path fill="url(#CAR_2)" ... />
<path fill="url(#CAR_3)" ... />
When sprite.svg is generated using symbol
mode, these unique ids are replaced with a
,b
,c
, … and since this auto generating id names is reset in each file, we might face a sprite.svg file with more than one id name corresponding to a gradient.
Is there any way to stop generating these ids automatically and use the ones which are in original svg files?
Issue Analytics
- State:
- Created 6 years ago
- Reactions:2
- Comments:7
Top Results From Across the Web
repeating-linear-gradient() - CSS: Cascading Style Sheets
The repeating-linear-gradient() CSS function creates an image consisting of repeating linear gradients. It is similar to linear-gradient() ...
Read more >How to handle duplicate IDs for inline SVGs? - Stack Overflow
Here is a rough outline for a script to make the IDs of one SVG unique: 1. Generate a random token 2. Search...
Read more >Create gradients in Illustrator - Adobe Support
To copy a freeform gradient from one object to another, use the Color Picker tool in the toolbar. Create freeform gradient in points...
Read more >Gradients and Patterns – SVG 1.1 (Second Edition) - W3C
When gradientUnits="objectBoundingBox" and 'gradientTransform' is the identity matrix, the normal of the linear gradient is perpendicular to the gradient vector ...
Read more >Creating and Managing ArchestrA Graphics User's Guide
Viewing a Symbol in Read-Only Mode . ... The ArchestrA Symbol Editor is a powerful addition to the ... A copy of the...
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
I’ve made some code that fix this problem
@kirill-talk sorry for my late response. this solves the problem
I’m closing this issue as @kirill-talk and @idmistir solutions worked for me.