unwanted changes of SVG code

[quinta@ebf.cz]

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:

<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>

after conversion epub>epub

<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>

detected changes:
- 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?

[quinta@ebf.cz]

Calibre 7.7 (just for info; conversion behaviour seems to be years old)
Sample epubs (input/output):

[kovidgoyal]

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.

[quinta@ebf.cz]

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

[quinta@ebf.cz]

A picture is worth a thousand words.
Epub=>epub conversion input=>output:

=>

[quinta@ebf.cz]

Conversion output (of sample epub) in recent (7.8) Calibre version:

<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>

(style references are now present; style definitions themselves are moved to the css file) :

.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;
}

So styles defined inside of SVG are preserved. Which greatly improves text based SVG conversion output.

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.

[kovidgoyal]

That's not possible to implement as the SVG renderer does not support CSS.

[quinta@ebf.cz]

Originally Posted by kovidgoyal

the SVG renderer does not support CSS

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?

[kovidgoyal]

The renderer does not support CSS. CSS is specific to web browsers, not SVG. Its not going to work.

[quinta@ebf.cz]

Originally Posted by kovidgoyal

CSS is specific to web browsers, not SVG.

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?

[kovidgoyal]

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.