Comments (6)
This arc command is correct and standards-conformant SVG; your renderer (and presumably Illustrator and IconJar) just isn't parsing it properly. See SVG 1.1 §8.3.9 for an exhaustive grammar, but the gist of it is that you can condense a lot. Relevant for this particular case are the following rules:
- flags are always exactly one character (
0
/1
) - Whitespace can be left out wherever it's not absolutely necessary (including after flags and before negative numbers and leading decimal points)
- If a command letter is not given, it's the same as the previous command (except in the case of
M
/m
, where it'sL
/l
instead)
That is, the string a8 8 0 100-16 8 8 0 000 16
should parse as two arc commands:
"a" | nonnegative-number | comma-wsp? | nonnegative-number | comma-wsp? | number | comma-wsp | flag | flag | coordinate-pair |
---|---|---|---|---|---|---|---|---|---|
a |
8 |
|
8 |
|
0 |
|
1 |
0 |
0 -16 |
8 |
|
8 |
|
0 |
|
0 |
0 |
0 16 |
svg/svgo#1137 discusses this same problem, and offers some optimizations that can be turned off to work around the Illustrator bugs.
from icons.
I'm brand new to SVG, so at this point I honestly have no idea. I'm wondering if there's some validation we can implement to test for invalid SVG code? Also wondering if SVGO can be configured to help with something here. Will keep looking, but also please share any ideas if you have them. These SVGs are being exported from Figma.
from icons.
Not sure about validation, if you check out: https://www.w3.org/TR/SVG/paths.html#PathDataEllipticalArcCommands - this will explain what exactly the commands should look like, to be honest, I have no idea how the browsers are handling it, maybe i'm missing something.
from icons.
@wolfgang42 Thanks for your reply, this actually makes perfect sense, very detailed, cheers!
from icons.
I have successfully parsed these correctly now, thanks for the help, ill close the issue. Cheers.
from icons.
from icons.
Related Issues (20)
- Inner padding icons
- Copy icon does not work
- Calendar3 week fill - Incorrect SVG or CDN source icon
- There is still no list of categories which would be helpful when browsing.
- Book page turning icon
- Siren
- Share / Forward icon HOT 1
- Variants for table icon
- There is no icon representing equality. HOT 1
- Icon for brain / neuroscience
- Sponsor icons - Patreon, Ko-fi, Buymeacoffee HOT 1
- Add outlet-fill icon
- Add ethernet-fill icon
- Add terminal-split-fill icon
- Add tag TOSLINK to optical-audio icons
- Add printer-network and printer-network-fill icons
- “send-arrow-up” icon is corrupted
- Clipboard with Magnifier
- reversed diagram-2 and diagram-3 HOT 1
- Bitbucket Icon
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from icons.