search

magicsunday / webtrees-fan-chart

SVG based ancestor fan chart module for webtrees genealogy application.
GNU General Public License v3.0
59 stars 18 forks source link

Underlines not aligned in inner circles #82

Closed ekdahl closed 5 months ago

ekdahl commented 2 years ago

See image below. Using version 5ee7605 (latest commit as of now). image

magicsunday commented 2 years ago

The underline is just plain CSS. I can't reproduce the problem on my own either.

Please provide more information: ❓ Does this error only appear with the latest version of the module? ❓ Does it work with a different module version? ❓ Which browser do you use? ❓ Does it work correctly in another browser?

ekdahl commented 2 years ago

Module version Version 2.3.0 not compatible with my webtrees version. Version 2.4.0, here I see the odd lines. I'm sure it did not happen in some earlier version, since I have exported SVG files and printed so large that it would have been obvious.

webtrees Using version 2.1.4 of webtrees (but used previous version when reporting the issue)

Browser Same behavior in Chrome and Edge. Chrome version 101.0.4951.67 Edge version 101.0.1210.53

Sample site https://webtrees.ddns.net/tree/Ekdahl-Klahr/webtrees-fan-chart/1 Can be seen more clearly after zooming in.

magicsunday commented 2 years ago

This seems to be a bug in Chrome and therefore also in Edge since both are based on Chromium: https://stackoverflow.com/questions/21608754/svg-text-alignment-issues-with-a-curved-textpath

In Firefox, the rendering is fine (see image below), without any issues to me. I can't find any combination of text-rendering and font-family which always results in a proper rendering in chrome. There is always some glutch.

grafik

text-rendering: auto seems the most promising in chrome but its also not perfect: grafik

magicsunday commented 1 year ago

I created an issue: https://bugs.chromium.org/p/chromium/issues/detail?id=1407504

magicsunday commented 5 months ago

It has been fixed in Chrome v124. Now the underlines look nice and smooth here too.