fix: keep text outline stable under zoom - #603
Conversation
The Alt text outline stroked each glyph with a miter-joined stroke. When the canvas is scaled (zoom), femtovg renders text through direct path-stroking of the real glyph contour instead of the glyph atlas, where two issues surfaced: - the default miter join spikes at the sharp corners of glyph outlines, so the outline visually "explodes" the further you zoom in (Satty-org#596); - femtovg additionally scales the stroke width by its internal font_scale (a quantized canvas average scale) on top of the transform, so the outline grew disproportionately with zoom and no longer matched the exported image. Stroke the outline with round joins and divide the width back out by that same font_scale, so the border stays smooth and keeps a constant thickness relative to the glyphs at every zoom level, matching the export. Fixes Satty-org#596
|
Thank you for the fix. Apparently there's a merge conflict here, did you base this of an older commit of yours? |
|
I debugged this a bit. The fix (idea) was working until #589 was merged which is upgrading femtovg from 0.25.0 to 0.26.0. IMHO looks like a issue in femtovg. Created a issue there - femtovg/femtovg#311 - maybe they can help. |
|
Yes, I forgot to update my local repository before fix. And, looks like it's definitely problem with femtovg, thanks for the issue! |
|
I applied your original changes slightly modified in PR #605. Can you try it? It keeps the outline mostly stable - but the fix is odd. I do not understand the internals of femtovg. A fix in femtovg would be better. 🙃 |
Fixes Satty-org#596 - partly. But it is odd any should not be like this. The value to switch scaling was manually determined. See - PR Satty-org#603 - femtovg/femtovg#311
|
A fix in femtovg is coming: femtovg/femtovg#312 So I close this. |
|
Sorry for the silence, been busy lately. Glad to see things worked out in the end :) |
3 participants
Fixes #596.
The Alt text outline stroked each glyph with a miter-joined stroke. When the canvas is scaled (zoom), femtovg renders text through direct path-stroking of the real glyph contour instead of the glyph atlas, and two issues surfaced there:
font_scale(a quantized canvas average scale) on top of the transform, so the outline grew disproportionately with zoom and no longer matched the exported image.Neither is visible in the export because that path uses only a translation (no scale) and goes through the glyph atlas, where the stroke width is taken raw.
Fix: stroke the outline with round joins and divide the width back out by that same
font_scale(mirroringquantize(avg_scale, 0.1).min(7.0)). The border stays smooth and keeps a constant thickness relative to the glyphs at every zoom level, matching the export.Verified by hand: large text, strong zoom, both
InvertedandContrastoutline modes — outline stays smooth and its thickness is stable across zoom and matches the saved PNG.