[GH-ISSUE #681] mx.svg flag has a problem #362

Closed
opened 2026-03-03 14:37:50 +03:00 by kerem · 3 comments
Owner

Originally created by @mydesweb on GitHub (Feb 23, 2020).
Original GitHub issue: https://github.com/lipis/flag-icons/issues/681

Hi,

When I try to import this file into Sketch it is displayed very wrong, also I receive a warning "No stops in gradient" when I try to import it in a mobile app for example. Other flags I use are working perfectly..

Originally created by @mydesweb on GitHub (Feb 23, 2020). Original GitHub issue: https://github.com/lipis/flag-icons/issues/681 Hi, When I try to import this file into Sketch it is displayed very wrong, also I receive a warning "**No stops in gradient**" when I try to import it in a mobile app for example. Other flags I use are working perfectly..
kerem closed this issue 2026-03-03 14:37:50 +03:00
Author
Owner

@Findus23 commented on GitHub (Feb 23, 2020):

According to https://validator.w3.org/check it is valid, but it definitely is one of the more complex SVGs.

Is it possible that it just uses SVG features that sketch doesn't support? It opens fine in Inkscape.

<!-- gh-comment-id:590085686 --> @Findus23 commented on GitHub (Feb 23, 2020): According to https://validator.w3.org/check it is valid, but it definitely is one of the more complex SVGs. Is it possible that it just uses SVG features that sketch doesn't support? It opens fine in Inkscape.
Author
Owner

@mydesweb commented on GitHub (Feb 23, 2020):

I manage somehow to fix it by importing in another editor like https://editor.method.ac then export again as SVG then imported well in Sketch then exported again as SVG.. I notice some difference

before (original):
<defs> <radialGradient id="b" cx="842.3" cy="103.7" r="25.9" gradientTransform="matrix(.14152 .03595 -.03453 .14198 213.1 162.4)" gradientUnits="userSpaceOnUse" xlink:href="#a"/> <radialGradient id="c" cx="651.5" cy="550.5" r="25.9" gradientTransform="matrix(-.13441 -.05384 .04964 -.12489 397.9 -24.3)" gradientUnits="userSpaceOnUse" xlink:href="#a"/> <radialGradient id="d" cx="380.8" cy="740.4" r="25.9" gradientTransform="matrix(.07536 .00282 -.00343 .14804 412.4 -203.6)" gradientUnits="userSpaceOnUse" xlink:href="#a"/> <linearGradient id="a"> <stop offset="0" stop-color="#fff"/> <stop offset="1" stop-color="#f15770"/> </linearGradient> </defs>

after(re-exported):
<defs> <radialGradient cx="48.6471552%" cy="50.0466395%" fx="48.6471552%" fy="50.0466395%" r="65.2031471%" gradientTransform="translate(0.486472,0.500466),scale(1.000000,0.674419),rotate(14.253232),translate(-0.486472,-0.500466)" id="radialGradient-1"> <stop stop-color="#FFFFFF" offset="0%"></stop> <stop stop-color="#F15770" offset="100%"></stop> </radialGradient> <radialGradient cx="50.6380978%" cy="49.5370161%" fx="50.6380978%" fy="49.5370161%" r="60.4857919%" gradientTransform="translate(0.506381,0.495370),scale(0.673913,1.000000),rotate(-158.170668),translate(-0.506381,-0.495370)" id="radialGradient-2"> <stop stop-color="#FFFFFF" offset="0%"></stop> <stop stop-color="#F15770" offset="100%"></stop> </radialGradient> <radialGradient cx="49.0344545%" cy="50.9185778%" fx="49.0344545%" fy="50.9185778%" r="44.3906836%" gradientTransform="translate(0.490345,0.509186),scale(1.000000,0.488889),rotate(2.143030),translate(-0.490345,-0.509186)" id="radialGradient-3"> <stop stop-color="#FFFFFF" offset="0%"></stop> <stop stop-color="#F15770" offset="100%"></stop> </radialGradient> </defs>

<!-- gh-comment-id:590087165 --> @mydesweb commented on GitHub (Feb 23, 2020): I manage somehow to fix it by importing in another editor like https://editor.method.ac then export again as SVG then imported well in Sketch then exported again as SVG.. I notice some difference before (original): ` <defs> <radialGradient id="b" cx="842.3" cy="103.7" r="25.9" gradientTransform="matrix(.14152 .03595 -.03453 .14198 213.1 162.4)" gradientUnits="userSpaceOnUse" xlink:href="#a"/> <radialGradient id="c" cx="651.5" cy="550.5" r="25.9" gradientTransform="matrix(-.13441 -.05384 .04964 -.12489 397.9 -24.3)" gradientUnits="userSpaceOnUse" xlink:href="#a"/> <radialGradient id="d" cx="380.8" cy="740.4" r="25.9" gradientTransform="matrix(.07536 .00282 -.00343 .14804 412.4 -203.6)" gradientUnits="userSpaceOnUse" xlink:href="#a"/> <linearGradient id="a"> <stop offset="0" stop-color="#fff"/> <stop offset="1" stop-color="#f15770"/> </linearGradient> </defs> ` after(re-exported): ` <defs> <radialGradient cx="48.6471552%" cy="50.0466395%" fx="48.6471552%" fy="50.0466395%" r="65.2031471%" gradientTransform="translate(0.486472,0.500466),scale(1.000000,0.674419),rotate(14.253232),translate(-0.486472,-0.500466)" id="radialGradient-1"> <stop stop-color="#FFFFFF" offset="0%"></stop> <stop stop-color="#F15770" offset="100%"></stop> </radialGradient> <radialGradient cx="50.6380978%" cy="49.5370161%" fx="50.6380978%" fy="49.5370161%" r="60.4857919%" gradientTransform="translate(0.506381,0.495370),scale(0.673913,1.000000),rotate(-158.170668),translate(-0.506381,-0.495370)" id="radialGradient-2"> <stop stop-color="#FFFFFF" offset="0%"></stop> <stop stop-color="#F15770" offset="100%"></stop> </radialGradient> <radialGradient cx="49.0344545%" cy="50.9185778%" fx="49.0344545%" fy="50.9185778%" r="44.3906836%" gradientTransform="translate(0.490345,0.509186),scale(1.000000,0.488889),rotate(2.143030),translate(-0.490345,-0.509186)" id="radialGradient-3"> <stop stop-color="#FFFFFF" offset="0%"></stop> <stop stop-color="#F15770" offset="100%"></stop> </radialGradient> </defs> `
Author
Owner

@lipis commented on GitHub (Nov 8, 2020):

Can't do much about it.

<!-- gh-comment-id:723628750 --> @lipis commented on GitHub (Nov 8, 2020): Can't do much about it.
Sign in to join this conversation.
No milestone
No project
No assignees
1 participant
Notifications
Due date
The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set.

Reference
starred/flag-icons#362
No description provided.