dringtech / ifg-charts

Visualisation component library for IfG
MIT License
1 stars 0 forks source link

Title on SVG download not centred #10

Closed gilesdring closed 1 week ago

gilesdring commented 4 months ago

When you download the chart as an SVG, the title text isn’t vertically centred in the blue bar as it is on the website/PNG – it’s a little too high up. Please could we fix this?

philipnye commented 4 months ago

@gilesdring We've been looking into this one. It's slightly different to as originally described - and seems an issue with the software we're using to read SVGs (Inkscape) rather than the SVGs themselves.

Happy for this to be marked as closed.

gilesdring commented 4 months ago

I did wonder... Here's what a downloaded SVG looks like for me...

image
gilesdring commented 4 months ago

Closing as discussed.

sachinsavur commented 4 months ago

@gilesdring we've dug into this a bit more. Inkscape seems to struggle with 'dominant-baseline = "hanging"' and shifts everything up a bit. This applies to not just the title, but also the axis labels and the footer.

A fix that we've found is replacing all instances of 'dominant-baseline="hanging"' with 'dy="0.85em"' (see the attached file for Ben Bradshaw, with the unedited version for reference).

Do you think there would be any undesirable consequences from this? If not, could you edit the code for the title, axis labels and footer to replace the dominant-baseline with dy="0.85em"?

where dy=0.85em: Ben Bradshaw - dy = 0 85em

original version for reference: Ben Bradshaw original

gilesdring commented 3 months ago

Have added as small fix - will include in next release

philipnye commented 3 months ago

Great, thank you

sachinsavur commented 1 month ago

Thanks for making this fix Giles - happy for it to be marked as closed.