03-22-2024, 04:13 PM | #1 |
Connoisseur
Posts: 59
Karma: 10
Join Date: Mar 2019
Device: Kindle 3 Paperwhite
|
unwanted changes of SVG code
I met epubs, in which there are used inline svg images for formating text of publisher book pages.
These images, during conversion in Calibre, are not converted correctly. When converting to docx/mobi (et cetera), conversion output of images is png, in which texts defined in svg are present – but are very dificcult to read because of their size, reduced into fractions of pixels... This not desirable behaviour was spoted for plenty of years, without the prospect of a solution. But now, accidentally, occurs conversion epub>epub... Output epub shows the same appearance of svg images as images converted to png. Now there is posibility to see the reason, when tracking changes between input and output svg: source inline svg: Code:
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="100%" height="100%" version="1.1" style="shape-rendering:geometricPrecision; text-rendering:geometricPrecision; image-rendering:optimizeQuality; fill-rule:evenodd; clip-rule:evenodd" viewBox="0 0 15849.6 21132.8" xmlns:xlink="http://www.w3.org/1999/xlink" > <defs> <style type="text/css"> <![CDATA[ .fil0 {fill:#2B2A29} .fnt1 {font-weight:bold;font-size:493.89px;font-family:'MIRobokat'} .fnt0 {font-weight:normal;font-size:635px;font-family:'MIRobokat'} ]]> </style> </defs> <g id="Vrstva_x0020_1"> <text x="5218.93" y="6709.26" class="fil0 fnt0">KAREL ČAPEK</text> <text x="5265.25" y="7298.9" class="fil0 fnt1">VÁLKA S MLOKY</text> </g> </svg> Code:
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" width="100%" height="100%" version="1.1" viewBox="0 0 15849.6 21132.8" class="calibre2"> <defs> <style type="text/css" class="calibre3"> .fil0 {fill:#2B2A29} .fnt1 {font-weight:bold;font-size:493.89px;font-family:'MIRobokat'} .fnt0 {font-weight:normal;font-size:635px;font-family:'MIRobokat'} </style> </defs> <g id="Vrstva_x0020_1"> <text x="5218.93" y="6709.26">KAREL ČAPEK</text> <text x="5265.25" y="7298.9">VÁLKA S MLOKY</text> </g> </svg> - removed some properties of svg element - added class="calibre2" (height: auto; width: auto; ) to svg element - added class="calibre3" (display: none; ) to style element - removed CDATA section around style definition - removed style reference from text elements (Especially losing the connection to the styles makes the conversion output completely unreadable.) My question is: Are such changes (or in general any changes...) of svg intentional? And is there possibility to avoid them? Last edited by quinta@ebf.cz; 03-22-2024 at 06:48 PM. |
03-22-2024, 06:13 PM | #2 |
Connoisseur
Posts: 59
Karma: 10
Join Date: Mar 2019
Device: Kindle 3 Paperwhite
|
Calibre 7.7 (just for info; conversion behaviour seems to be years old)
Sample epubs (input/output): |
03-22-2024, 11:23 PM | #3 |
creator of calibre
Posts: 44,419
Karma: 24044628
Join Date: Oct 2006
Location: Mumbai, India
Device: Various
|
SVG is converted to PNG for output formats that dont support SVG. As for your EPUB to EPUB conversion issues, open a bug report and attach the files.
|
03-23-2024, 02:57 AM | #4 |
Connoisseur
Posts: 59
Karma: 10
Join Date: Mar 2019
Device: Kindle 3 Paperwhite
|
Rendering svg to png was mentioned just as background info. It doesnt appear as issue itself.
Calibre bug tracker found: https://bugs.launchpad.net/calibre Possible bug reported: https://bugs.launchpad.net/calibre/+bug/2058798 |
03-23-2024, 03:31 AM | #5 |
Connoisseur
Posts: 59
Karma: 10
Join Date: Mar 2019
Device: Kindle 3 Paperwhite
|
A picture is worth a thousand words.
Epub=>epub conversion input=>output: => |
04-05-2024, 07:39 PM | #6 |
Connoisseur
Posts: 59
Karma: 10
Join Date: Mar 2019
Device: Kindle 3 Paperwhite
|
Conversion output (of sample epub) in recent (7.8) Calibre version:
Code:
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" width="100%" height="100%" version="1.1" viewBox="0 0 15849.6 21132.8" class="calibre2"> <defs> </defs> <g id="Vrstva_x0020_1"> <text x="5218.93" y="6709.26" class="fil">KAREL ČAPEK</text> <text x="5265.25" y="7298.9" class="fil1">VÁLKA S MLOKY</text> </g> </svg> Code:
.fil { fill: #2B2A29; font-family: "MIRobokat"; font-size: 635px; font-weight: normal; line-height: 1.2; } .fil1 { fill: #2B2A29; font-family: "MIRobokat"; font-size: 493.89px; font-weight: bold; line-height: 1.2; } One small flaw: Styles are only preserved for epub output. In case epub is converted into docx/mobi/etc., seems svg images are still rendered (into png) without applying styles. |
04-06-2024, 11:43 PM | #7 |
creator of calibre
Posts: 44,419
Karma: 24044628
Join Date: Oct 2006
Location: Mumbai, India
Device: Various
|
That's not possible to implement as the SVG renderer does not support CSS.
|
04-07-2024, 01:54 PM | #8 |
Connoisseur
Posts: 59
Karma: 10
Join Date: Mar 2019
Device: Kindle 3 Paperwhite
|
I see. That's a problem. Does it mean "no styles at all"? Including (hypothetical) styles defined inside of svg code?
I'm beginning to suspect that due to the previous code modifications done by the conversion, the internal svg styles are not getting to the renderer at all. But purely hypothetically - if the renderer received svg code including internal style definitions (either in the form of inline styles or in the form of definitions in the internal style section...), would it be able to interpret them? Last edited by quinta@ebf.cz; 04-07-2024 at 02:03 PM. Reason: possible forms of svg internal styles |
04-07-2024, 10:01 PM | #9 |
creator of calibre
Posts: 44,419
Karma: 24044628
Join Date: Oct 2006
Location: Mumbai, India
Device: Various
|
The renderer does not support CSS. CSS is specific to web browsers, not SVG. Its not going to work.
|
04-08-2024, 05:05 AM | #10 |
Connoisseur
Posts: 59
Karma: 10
Join Date: Mar 2019
Device: Kindle 3 Paperwhite
|
I met styling of SVG just a few days ago. So sorry. Now I'm probably going to say something very dumb...
But did not SVG actually ordinarily use CSS? I mean: in SVG you can write styles (directly using "style" attribute, or by declaring styles in "style" element, and then refering them via "class" attribute)... And the whole thing is called "CSS"... See for example: https://www.w3.org/TR/SVG/styling.html#StylingUsingCSS Calibre itself has just now in version 7.8 started to move styles defined in SVG to CSS files (referenced from HMTL) during conversion... (So the "HTML CSS" and "SVG CSS" is mixed in one place...) And that, to my slight surprise, really works... At least in Calibre. Styles defined in external CSS file are successfully applied to displayed SVG images. So couldn't the renderer also interpret the styles? (In the perfect fairy world.) After all, isn't it the same task as when displaying SVG images (in the editor preview, or in the reader...)? Isn't it simply a matter of "visualization" of SVG in both cases? |
04-08-2024, 06:07 AM | #11 |
creator of calibre
Posts: 44,419
Karma: 24044628
Join Date: Oct 2006
Location: Mumbai, India
Device: Various
|
The SVG renderer is not a web browser, if you want it to support CSS, feel free to ask its developers to add support for it: It is QSvgRenderer from the Qt toolkit.
|
|
Similar Threads | ||||
Thread | Thread Starter | Forum | Replies | Last Post |
Line break adds unwanted code, how to change this? | Pedro Magnifico | Sigil | 18 | 03-16-2021 07:19 PM |
Can't add cover in Calibre -- get "svg-error" (the property 'svg' should be declared) | Just some guy | Editor | 7 | 04-11-2017 09:54 PM |
After I Edit Code, Save, and Convert, all my Code Edits are Gone | lukewrussell | Calibre | 1 | 03-14-2014 08:05 PM |
Unwanted delete | mrmikel | Editor | 2 | 02-14-2014 03:18 PM |
Let's create a source code repository for DR 800 related code? | jraf | iRex | 3 | 03-11-2010 12:26 PM |