Bug 87450 - SVG with embedded PNG reduced in quality and distorted
Summary: SVG with embedded PNG reduced in quality and distorted
Status: NEW
Alias: None
Product: LibreOffice
Classification: Unclassified
Component: Impress (show other bugs)
Version:
(earliest affected)
4.0.0.3 release
Hardware: All All
: medium normal
Assignee: Not Assigned
URL:
Whiteboard:
Keywords: bibisected, filter:svg
: 112469 (view as bug list)
Depends on:
Blocks: SVG-Import
  Show dependency treegraph
 
Reported: 2014-12-18 17:01 UTC by Shimi Chen
Modified: 2023-11-08 23:13 UTC (History)
6 users (show)

See Also:
Crash report or crash signature:


Attachments
odp file in which the bug can be seen when presenting (46.42 KB, application/vnd.oasis.opendocument.presentation)
2014-12-18 17:01 UTC, Shimi Chen
Details
Only the isolated png image (262 bytes, image/png)
2018-06-18 15:24 UTC, Regina Henschel
Details
Only the isolated svg image (32.02 KB, image/svg+xml)
2018-06-18 15:45 UTC, Shimi Chen
Details
sample ODP with PNG and SVG side by side (45.76 KB, application/vnd.oasis.opendocument.presentation)
2023-11-08 19:49 UTC, Stéphane Guillou (stragu)
Details

Note You need to log in before you can comment on or make changes to this bug.
Description Shimi Chen 2014-12-18 17:01:35 UTC
Created attachment 110994 [details]
odp file in which the bug can be seen when presenting

The attached file looks fine in normal view but when hitting F5 for presentation view, the image becomes blurred and the important information is lost.

The image is an imported SVG file.
Comment 1 Robinson Tryon (qubit) 2014-12-24 04:30:57 UTC
TESTING with LO 4.4.0.1 + Ubuntu 14.04

(In reply to Shimi Chen from comment #0)
> The attached file looks fine in normal view but when hitting F5 for
> presentation view, the image becomes blurred and the important information
> is lost.

CONFIRMED: image becomes very blurred (in a neat, artistic way, as it turns out, but that doesn't change the fact that we have a bug :-)

Totally weird!

Status -> NEW
Comment 2 QA Administrators 2016-01-17 20:03:25 UTC Comment hidden (obsolete)
Comment 3 Shimi Chen 2016-01-18 11:30:46 UTC
Bug still occurs in 5.0.4 with the example file.
Regarding regression testing, with 3.3 the svg does not work at all. As far as I can tell native svg import was introduced in 4.0.

I tested 4.0.0.3 and it's interesting. The blurred image appears both in presentation mode but also in editing mode. So somewhere between 4.0.0.3 and 4.3.4.1 it was fixed for editing mode but not presentation mode.
Comment 4 QA Administrators 2017-03-06 14:08:53 UTC Comment hidden (obsolete)
Comment 5 Shimi Chen 2017-03-06 14:20:45 UTC
Bug behavior has changed in 5.3.

Previously, the SVG was displayed correctly in editing mode and incorrectly in presentation mode.

Currently (5.3.0.3), the SVG is displayed incorrectly (smeared) in both modes.
Comment 6 Xisco Faulí 2017-10-01 22:50:45 UTC
*** Bug 112469 has been marked as a duplicate of this bug. ***
Comment 7 Regina Henschel 2018-06-18 15:24:59 UTC
Created attachment 142870 [details]
Only the isolated png image

The error is not a problem of svg. The attached file contains an embedded png-image, which is scaled up by a transformation. The image itself has 11x11 pixels. I have extracted the image from the file and attached it.
If you insert this small image and scale it up, you will see the same. The rendering is independent of Antialiasing on/off.
Comment 8 Shimi Chen 2018-06-18 15:45:42 UTC
Created attachment 142871 [details]
Only the isolated svg image

Yes, it appears that LibreOffice automatically converts the svg to a png and the resulting png file is deformed. The original svg is also included in the odp archive next to it (attached), and shows the correct image if opened in Inkscape for example.

I now see that Eye of MATE also shows the distorted image if the svg is opened, so this is likely an issue with some common upstream library (librsvg?). Does LibreOffice indeed use librsvg? At any case, I will work on submitting it as a bug with librsvg as it does distort the image when converting it to png.
Comment 9 Regina Henschel 2018-06-18 15:58:48 UTC
The svg-file itself has the image as embedded png. It is the part

        <g transform="matrix(34.7273,0,0,31.1818,64,31)" style="fill-opacity:0; fill:rgb(0,0,0); text-rendering:optimizeSpeed; color-rendering:optimizeSpeed; image-rendering:optimizeSpeed; shape-rendering:crispEdges; color-interpolation:sRGB; stroke:rgb(0,0,0); stroke-opacity:0;" >
            <image x="0" y="0" width="11" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAsAAAALCAIAAAAmzuBxAAAAzUlEQVR42i2QWxHE IBRD4wAJlVAJlVAJKwEJSKiESkBCJVQCEpCQPWF3hg+4yc0DedcluUjqOtzcHh+6 XDw1fLprSLf0QNAE5q5iWy+ruxW8ZM+PmKwNa3M1uq9PqcLF4pCrQD0gbFhoOrqP QYUdS27Z8Z0lOJzbHw5Q7He/m0fXUqpCAyVQcmBNzkihny63gZlSh+zTpZOFRxLt KUbeC5G27EvYTasqhwR8AErkTfNu2i7hseBlkQS/4TR3CsNO//UtSRCvaIlx2H+P +QWSoailUww0wQAAAABJRU5ErkJggg==" style="clip-path:url(#clipPath2);" height="11" preserveAspectRatio="none" />
        </g >

You can see in the matrix, that it is extreme up-scaled. The question is, how such up-scaling is done.
Comment 10 Shimi Chen 2018-06-19 08:20:52 UTC
Ah, thanks for that. Now I see also that in Inkscape when selecting the image it is easy to change between the distorted and non-distorted views.

This is done by switching the Image Rendering mode between optimizeSpeed (shows the *correct* image) and optimizeQuality (shows the *distorted* image). The svg file specifies that the image should be displayed using optimizeSpeed, and LibreOffice apparently ignores that?

Or perhaps there is no standard way to implement optimizeSpeed and Inkscape happens to use a method which shows the intended result?
Comment 11 Timur 2018-12-06 13:23:43 UTC
Can't say why it was marked Linux. Also repro Windows. LO 3.5 and 6.3+.
Comment 12 QA Administrators 2020-12-11 03:47:43 UTC Comment hidden (obsolete)
Comment 13 Hossein 2021-12-20 06:32:17 UTC
Still reproducible in the latest 7.4 master:

Version: 7.4.0.0.alpha0+ / LibreOffice Community
Build ID: e34067483ef78c1569641becfe99b79a97600aed
CPU threads: 8; OS: Linux 5.11; UI render: default; VCL: gtk3
Locale: en-US (en_US.UTF-8); UI: en-US
Calc: threaded
Comment 14 Hossein 2021-12-20 06:54:52 UTC
This is not reproducible in Linux Qt5 and X11 (the output is good):

Version: 7.4.0.0.alpha0+ / LibreOffice Community
Build ID: 603558df5777c84d99df88228799533a3bc9f64a
CPU threads: 8; OS: Linux 5.11; UI render: default; VCL: qt5 (qfont+xcb)
Locale: en-US (en_US.UTF-8); UI: en-US
Calc: threaded

Version: 7.4.0.0.alpha0+ / LibreOffice Community
Build ID: 603558df5777c84d99df88228799533a3bc9f64a
CPU threads: 8; OS: Linux 5.11; UI render: default; VCL: x11
Locale: en-US (en_US.UTF-8); UI: en-US
Calc: threaded

But it is reproducible in Windows (the output is bad):

Version: 7.2.1.2 (x64) / LibreOffice Community
Build ID: 87b77fad49947c1441b67c559c339af8f3517e22
CPU threads: 32; OS: Windows 10.0 Build 19043; UI render: Skia/Raster; VCL: win
Locale: en-US (en_DE); UI: en-US
Calc: threaded

It is reproducible in Linux gtk3 (previous comment), also gtk4 and kf5:

Version: 7.4.0.0.alpha0+ / LibreOffice Community
Build ID: 603558df5777c84d99df88228799533a3bc9f64a
CPU threads: 8; OS: Linux 5.11; UI render: default; VCL: gtk4
Locale: en-US (en_US.UTF-8); UI: en-US
Calc: threaded

Version: 7.4.0.0.alpha0+ / LibreOffice Community
Build ID: 603558df5777c84d99df88228799533a3bc9f64a
CPU threads: 8; OS: Linux 5.11; UI render: default; VCL: kf5 (cairo+xcb)
Locale: en-US (en_US.UTF-8); UI: en-US
Calc: threaded
Comment 15 Stéphane Guillou (stragu) 2022-11-23 08:51:34 UTC
The extracted SVG displays crisp in Firefox 107.0, but blurred in Chromium 107.0.5304.110 and GNOME Image Viewer 3.36.3.
On Ubuntu 20.04.

As in Comment 10, Inkscape 1.2 shows the crisp embedded PNG if the rendering mode is set to optimizeSpeed. However, changing all "optimizeQuality" values to "optimizeSpeed" in the SVG won't change the blurry look in LibreOffice.

Version: 7.5.0.0.alpha0+ (X86_64) / LibreOffice Community
Build ID: deb7bc82de19ea8e20c767fdf21f9ba4feb5e9f0
CPU threads: 8; OS: Linux 5.15; UI render: default; VCL: gtk3
Locale: en-AU (en_AU.UTF-8); UI: en-US
Calc: threaded
Comment 16 Stéphane Guillou (stragu) 2023-11-08 19:49:59 UTC
Created attachment 190733 [details]
sample ODP with PNG and SVG side by side

I had a look at the history of it, testing with both the SVG and the PNG-only (see attachment) in the linux-64-releases bibisect repo:

- from OOo 3.3: only PNG supported, always blurry.
- from 4.0.0.1: SVG now supported as well, both always blurry.
- from 4.2.0.0.beta1:
  - gen: crisp in edit mode, blurry in presentation
  - gtk: could not test
- from 5.1.1.1: crisp in edit mode, blurry in presentation (both gen and gtk)
- from 6.2.0.0.alpha1:
  - gen: crisp in edit mode, blurry in presentation (as before)
  - gtk3: always blurry
- from 7.6 to current trunk: always blurry. This started with Caolán's commit 6d1ba1877ac1e8d77748b238a7706e3a4f8d9ed4: "use SvpSalBitmap for X11/gen also".

Looks like we've just been going back and forth between methods of upscaled bitmap rendering / interpolation, with some difference between VCL plugins when in edit mode. At least, the interpolation is now consistently used between edit / presentation modes, and between VCL plugins.

Result is always the same regardless of if it is inside the SVG or the PNG is on its own, so I'm tempted to remove the SVG keywords. However, there might be something we could better support in the image rendering settings included in the SVG, possibly the image-rendering attribute, but I don't understand the SVG spec enough so leaving as it is.