Incorrect text positioning in SVG rasterization (scale/transform; font-size; kerning)
Closed, ResolvedPublic0 Estimated Story Points
Actions

Assigned To

Authored By

	• bzimport
	Mar 4 2012, 10:10 AM

Description

The text in these two SVGs should render identically:

However the text in the first has screwed up kerning, while the text in the second doesn't. The only difference between the two SVGs is that the first one used a small font size (3px) which is scaled up by the viewBox, while the second one uses a larger font size (24px) and is not scaled. In Firebox's native SVG renderer, they both look fine.

Screenshot of the difference (as rendered on Commons):

example-screen-shot.png (366×627 px, 28 KB)

and with render size 320px:

Rsvg_text_rendering_test_1.svg (1).png (160×264 px, 4 KB)

Ccl_climate_dividend_cycle_english.svg.png (566×800 px, 60 KB)

Details

Reference: bz34947

Related Objects
Search...

Status	Assigned	Task
Resolved	hnowlan	T213139 Discrepancies in SVG Translate's pngs and Commons' versions in character and word spacings
Resolved	JoKalliauer	T36947 Incorrect text positioning in SVG rasterization (scale/transform; font-size; kerning)
Resolved	hnowlan	T193352 Update librsvg to ≥2.42.3 (2.44.10)
Resolved	hnowlan	T216815 Upgrade Thumbor to Buster
Invalid	None	T212941 Investigate systemd hardening to replace Firejail for Thumbor
Resolved	fgiunchedi	T212946 Stream Thumbor logs to logstash
Resolved	• Gilles	T187765 Replace the Nginx fronting Thumbor with Haproxy
Resolved	fgiunchedi	T204266 Backport prometheus haproxy exporter for Jessie
Resolved	jijiki	T220499 Export useful metrics from haproxy logs for Thumbor
Resolved	jijiki	T221562 Build Thumbor packages for buster

Event Timeline

There are a very large number of changes, so older changes are hidden. Show Older Changes

Ooops, you are right. The text is not stroked.

Ebe123 awarded a token.Aug 15 2017, 4:40 AM

Ebe123 mentioned this in T49578: Score should output SVG.Aug 15 2017, 11:34 PM

Here's another example of how our SVG text rendering has significantly degraded in the past year (please view these at full size):

Old thumbnail:

New thumbnail:

These are both thumbnails of the same SVG. Note the thinner and more pixelated text in the new thumbnail.

If you look at smaller thumbnails (the kind we typically show in articles), you start to notice significant kerning problems:

Old thumbnail:

Screen Shot 2017-11-04 at 3.08.02 PM.png (278×250 px, 31 KB)

New thumbnail:

Screen Shot 2017-11-04 at 3.08.11 PM.png (278×250 px, 30 KB)

Just spotted at https://commons.wikimedia.org/wiki/File:Mexico_1835-1846_administrative_map-en-2.svg. Uploading a transform-simplified version with SVGO to see whether it helps. (It doesn't.)

Before I saw this problem I actually enjoyed some of the spacing/hinting/gridfitting/whatever decisions at very small sizes that seems to help with legibility...

Aklapper, what svg library is your copy of imagemagick convert calling? Is it the built-in one or the rsvg one? Consider using rsvg-convert so you know you are actually using rsvg.

Supposedly this is fixed by https://gitlab.gnome.org/GNOME/librsvg/commit/c70000117fb6e7dabdb77c1c8cc1067add7da6d9, which landed in librsvg 2.40.19. See https://gitlab.gnome.org/GNOME/librsvg/issues/151 and https://bugzilla.gnome.org/show_bug.cgi?id=587721.

@MoritzMuehlenhoff: At the risk of crying wolf, any chance we could upgrade librsvg on the scaling servers from 2.40.16 to 2.40.19?

Arthur2e5 mentioned this in T180924: Deploy Noto fonts or their derivatives for Chinese (and J&K?).Dec 13 2017, 10:43 PM

Perhelion mentioned this in T180923: Publish full fallback sequence for (generic) font families (sans, serif) in SVG rendering.Dec 14 2017, 3:57 PM

JoKalliauer subscribed.Dec 16 2017, 9:00 PM

This task is blocking T49578: Score should output SVG as PNG conversion is taken up by librsvg (not ImageMagick) in the update. We get results such as:

O_Canada_Lilypond.svg.png (556×689 px, 42 KB)

Librsvg should be upgraded to get rid of this block.

Ebe123 added a comment.Dec 26 2017, 7:34 PM

This comment was removed by Ebe123.

Pinging @MoritzMuehlenhoff. Please see my most recent comment above. Thanks!

Pinging @kaldari . File:O_Canada_Lilypond.svg has a woring workaround: File:O_Canada_Lilypond_Workaround.svg

The workaround is pretty easy:
<g transform="scale(10)">
...
</g>

and ungroup everything with inkscape.

FYI, librsvg 2.40.19 (which supposedly fixes this bug) requires Pango 1.38.0 or later (released in 2015) and libxml2 2.9.0.

@MoritzMuehlenhoff: Any thoughts about the possibility of upgrading to librsvg 2.40.19 (or 2.40.20)? I know there's also a plan to migrate the image scalers to Debian stretch (T174431), which might take care of this for free, but it's not clear how soon that might actually happen.

ToBeFree awarded a token.Jun 7 2018, 4:01 AM

ToBeFree subscribed.

Jc86035 awarded a token.Jul 10 2018, 8:28 AM

Jc86035 subscribed.

TheDJ added a project: Upstream.Jul 18 2018, 2:40 PM

TheDJ moved this task from Backlog to Patch merged upstream on the Upstream board.

JoKalliauer mentioned this in T40010: RFC: Re-evaluate librsvg as SVG renderer on Wikimedia wikis.Jul 22 2018, 10:26 AM

When we migrate the image scalers to Debian stretch we'll have a refreshed graphics library stack.

@MoritzMuehlenhoff: It looks like the migration of the image scalars to Debian stretch is complete, but this bug is still present and it doesn't look like a refreshed graphics stack was included in the upgrade: https://tools.wmflabs.org/apt-browser/stretch-wikimedia/main/. Now that the migration is complete, could we manually refresh the graphics stack (or at least librsvg and its dependencies)?

kaldari removed a project: Upstream.Aug 11 2018, 12:50 AM

Perhelion mentioned this in T205776: Punjabi letters in SVG files have unnecessary spacing in their corresponding PNG thumbnails.Oct 3 2018, 2:32 PM

kaldari added a subtask: T170817: Upgrade Thumbor servers to Stretch.Oct 4 2018, 6:13 PM

kaldari mentioned this in T170817: Upgrade Thumbor servers to Stretch.Oct 4 2018, 6:31 PM

Liuxinyu970226 subscribed.Oct 30 2018, 4:19 AM

Liuxinyu970226 awarded a token.Nov 11 2018, 12:20 PM

• Phabricator_maintenance moved this task from Backlog to Acknowledged on the SRE board.Jan 26 2019, 7:47 PM

Aklapper removed a parent task: T18368: [SVG Rendering] Worsening of font rendering quality.Feb 22 2019, 3:29 PM

JoKalliauer mentioned this in T213013: PNG thumbnail of SVG image shows incorrectly (general texts problem) .Feb 22 2019, 4:39 PM

jijiki added a project: Thumbor.Feb 22 2019, 7:40 PM

jijiki added a parent task: T193352: Update librsvg to ≥2.42.3 (2.44.10).

jijiki removed subtasks: T170817: Upgrade Thumbor servers to Stretch, T33122: rsvg on scaler does not support styling the root element.

JoKalliauer merged a task: T213013: PNG thumbnail of SVG image shows incorrectly (general texts problem) .Feb 23 2019, 11:20 AM

JoKalliauer added subscribers: Leksey, jijiki, Xiplus, • Krassotkin.

Niridya subscribed.Feb 24 2019, 1:07 PM

AntiCompositeNumber subscribed.Mar 25 2019, 8:25 PM

• hdothiduc subscribed.Apr 30 2019, 7:26 PM

• hdothiduc mentioned this in T219547: Wikimedia Hackathon 2019: Design a flowchart .May 13 2019, 12:59 PM

Inductiveload subscribed.Jan 13 2020, 8:45 AM

JoKalliauer mentioned this in T243893: Test resvg on Beta Cluster.Jan 29 2020, 12:05 PM

JoKalliauer mentioned this in T213139: Discrepancies in SVG Translate's pngs and Commons' versions in character and word spacings.Mar 22 2020, 5:47 PM

JoKalliauer mentioned this in T220832: [BUG] Some text rendered poorly.

AntiCompositeNumber mentioned this in T239311: Incorrect character placement in PNG thumbnail rendered from SVG.May 12 2020, 7:27 PM

AntiCompositeNumber removed a parent task: T193352: Update librsvg to ≥2.42.3 (2.44.10).May 14 2020, 4:31 AM

AntiCompositeNumber added a subtask: T193352: Update librsvg to ≥2.42.3 (2.44.10).

AntiCompositeNumber merged a task: T239311: Incorrect character placement in PNG thumbnail rendered from SVG.May 22 2020, 2:11 AM

AntiCompositeNumber moved this task from Backlog to Upstream (librsvg) on the Thumbor board.

AntiCompositeNumber added a subscriber: OrenBochman.

AntiCompositeNumber mentioned this in T142908: bad kerning of SVG rendering of diacritical marks as unicode characters.May 25 2020, 10:45 PM

toorich changed the status of subtask T193352: Update librsvg to ≥2.42.3 (2.44.10) from Stalled to Open.Jun 24 2020, 9:59 AM

Aklapper changed the status of subtask T193352: Update librsvg to ≥2.42.3 (2.44.10) from Open to Stalled.Jun 24 2020, 10:34 AM

JoKalliauer mentioned this in T280718: Re-evaluate whether keeping around https://noc.wikimedia.org/conf/fc-list is a good practive.Apr 21 2021, 7:28 PM

JoKalliauer awarded a token.May 5 2021, 3:29 PM

The issue still exist in librsvg 2.51.1

Rendering of https://commons.wikimedia.org/wiki/File:Fonttest-Kerning.svg

Wikimedia librsvg 2.40	local 2.51.1

Comparison to other render of https://commons.wikimedia.org/wiki/File:Fonttest-Kerning_alsoCorrect.svg

Bildschirmfoto von 2021-05-05 17-41-19_.png (300×1 px, 232 KB)

At least the 2.51.1 result makes more sense and works in non-extreme scales...

JoKalliauer mentioned this in T282740: evaluate priorities of Wikimedia-svg-rendering-tasks .May 12 2021, 8:09 PM

In T36947#7076752, @Arthur2e5 wrote:

At least the 2.51.1 result makes more sense and works in non-extreme scales...

The lettes in indiviudal <tspan> got better (right column), but usually you use just one <tspan> for a whole word (left column), and that got worse, see T205776#7072788 and T142908#7072828 so updating librsvg to 2.50 will imho make this task even worse.

Regression reported upstream https://gitlab.gnome.org/GNOME/librsvg/-/issues/730

JoKalliauer added a project: Upstream.May 14 2021, 6:42 PM

JoKalliauer moved this task from Patch merged upstream to Reported Upstream on the Upstream board.

"Incorrect text spacing when transform is not 1:1" will be fixed in librsvg 2.51.2 (and librsvg 2.50.6, once backported) according to https://gitlab.gnome.org/GNOME/librsvg/-/issues/730 (thanks to JoKalliauer for investigation and upstreaming). It's unclear to me if this covers all the different things listed in this very ticket though.

Aklapper added a parent task: T213139: Discrepancies in SVG Translate's pngs and Commons' versions in character and word spacings.Jun 15 2021, 11:20 AM

JoKalliauer moved this task from Backlog to update librsvg on the Wikimedia-SVG-rendering board.Jun 30 2021, 2:51 PM

JoKalliauer edited subtasks, added: T265549: Update librsvg to version > 2.44.10 (2.50.3); removed: T193352: Update librsvg to ≥2.42.3 (2.44.10).Nov 3 2021, 9:51 PM

Another issue reported downstream: https://commons.wikimedia.org/wiki/User_talk:Chen-Pan_Liao#Your_File:Regression_lines.svg

svg	PNG 1000px (abandonware: WMF-c-librsvg2.40.21)	PNG 500px (abandonware: WMF-c-librsvg2.40.21)
source-svg

Leksey unsubscribed.Nov 4 2021, 1:46 AM

Also just affected File:Systemd-on-fedora.svg. I worked around it with cairosvg, which turns all text into paths; then I copied the text elements and pasted them into the new file with fill:rgba(0,0,0,0)

Xeriphas1994 subscribed.Feb 8 2022, 8:30 PM

Tholme subscribed.Mar 15 2022, 3:47 PM

JoKalliauer merged a task: T205776: Punjabi letters in SVG files have unnecessary spacing in their corresponding PNG thumbnails.Jun 11 2022, 2:21 PM

JoKalliauer added subscribers: satdeep_gill, Amire80, Jayprakash12345.

JoKalliauer changed the task status from Open to Stalled.Jun 20 2022, 3:23 PM

JoKalliauer added a subtask: T40010: RFC: Re-evaluate librsvg as SVG renderer on Wikimedia wikis.

JoKalliauer merged a task: T142908: bad kerning of SVG rendering of diacritical marks as unicode characters.Jul 4 2022, 12:22 PM

JoKalliauer added subscribers: Kulla, Steinsplitter, Poyekhali.

jbond removed a project: SRE.Nov 4 2022, 1:28 PM

file	librsvg2.40	lirbsvg2.44
https://commons.wikimedia.org/wiki/File:Fonttest-Kerning.svg
https://commons.wikimedia.org/wiki/File:38254-new_folder-6.svg	{F37007158, size=full}	{F37007164, size=full}

There might still be kerning issues, however I consider this issue as resolved.

Izno edited subtasks, added: T193352: Update librsvg to ≥2.42.3 (2.44.10); removed: T40010: RFC: Re-evaluate librsvg as SVG renderer on Wikimedia wikis, T265549: Update librsvg to version > 2.44.10 (2.50.3).May 17 2023, 11:21 PM

Arthur2e5 mentioned this in T265549: Update librsvg to version > 2.44.10 (2.50.3).May 21 2023, 7:26 AM

	F37004863: Screenshot 2023-05-17 at 10-45-38 File Fonttest-Kerning.svg – Wikimedia Commons.png
	May 17 2023, 2:47 PM

	F37004595: Screenshot 2023-05-17 at 10-45-28 File Fonttest-Kerning.svg – Wikimedia Commons.png
	May 17 2023, 2:47 PM

	F34728683: 20211103023141!Regression_lines.svg1000.png
	Nov 3 2021, 10:00 PM

	F34728685: 20211103023141!Regression_lines.svg500.png
	Nov 3 2021, 10:00 PM

	F34442058: 220px-Fonttest-Kerning.svg.png
	May 5 2021, 3:48 PM

	F34442061: Bildschirmfoto von 2021-05-05 17-41-19_.png
	May 5 2021, 3:48 PM

Incorrect text positioning in SVG rasterization (scale/transform; font-size; kerning)Closed, ResolvedPublic0 Estimated Story PointsActions

Description

Details

Related ObjectsSearch...

Event Timeline

Incorrect text positioning in SVG rasterization (scale/transform; font-size; kerning)
Closed, ResolvedPublic0 Estimated Story Points
Actions

Related Objects
Search...