LinwoodDev
[Enhancement]: SVG export compatibility
Which feature is your request related to?
export format
Describe your request for enhancements!
When exporting as SVG, the 8 character color format fill="#11223344" is not recognized by some tools.
To improve compatibility and perhaps standard compliance, fill-opacity=... and stroke-opacity= could be used instead: https://www.w3.org/TR/SVG2/painting.html#FillOpacity https://www.w3.org/TR/SVG2/painting.html#StrokeOpacity https://stackoverflow.com/questions/6042550/svg-fill-color-transparency-alpha (your link).
Thanks
Rerefence: https://github.com/LinwoodDev/Butterfly/discussions/962
Additional context
No response
Code of Conduct
- [x] I agree to follow this project's Code of Conduct
If you are at it: I am not sure what the fix would be but there seems to be issues with the color and properties of the text too.
Oh nevermind. I had the wrong issue opened. Yeah i think thats the same issue there
No problem. As a complement:
-
The fill-opacity seems also useful for the background (otherwise it is black in inkscape)
-
font properties don't seem exported (in the windows application at least) and there seems to be more objects exported than displayed (intermediate fonts before changing properties). There is an example that works in Inkscape, edge, windows preview:
The height don't seem to be honored (?). The fill and fill-opacity don't seem to work if put directly inside the
Thanks
Hi, the other things i will look at it. What do you mean with height?
The font in particular isn't easy. I have 3 things I have problems with:
How to handle custom fonts on Android?
On android you don't have a global font library on your system where you can install fonts. How should this be handled? How does other apps do this?
How to handle missing fonts?
Should we render the default font? Should we classify fonts in serif, sans-serif, monospace and then use the default serif, sans-serif, ... font?
How to export fonts?
How should custom fonts be exported on svg?
I have not found a way to find a solution to all these questions, so its current just no font specified. If you want to know the font, it's just Roboto by google.
Sorry, it was not clear.
By height I meant the height= inside the
height="208.0px" does not seem honored by edge/inkscape and width= neither. But font-size="45pt" is. font-size can be in pixel too if you have a way to compute it (e.g. font-size="32px").
The exact font may not work as you stated (if it is not embedded or available). But:
- font-style above works (normal | italic at least).
- There is font-family (serif, monospace, sans-serif at least or specific font. e.g. font-family="Arial, sans-serif"), and font-weight (normal, bold at least).
e.g. <text x="336.0px" y="185.60000000000002px" text-anchor="left" style="fill:#00ff00;fill-opacity:1" font-style="italic" font-size="132px" font-family="Roboto, sans-serif", font-weight="bold">
With these, the font may be close enough already. There seems to be more there: https://www.w3.org/TR/SVG2/text.html