Tooltips - Unable to resize fonts

[dmc-cambric]

Hi Team,

We've had a request from one of our clients to make the tooltip text more readable, so I've tried to increase the font size via. the tooltipTextStyle property on the ChartStyle interface.

However it seems to only increment the stroke width of the font rather than the actual size of the font. Could this be changed so that it increases the size of the text within the tooltip?

Using Ver 6.1.15

I think I've found the file that sets this value:

digital-growth-charts-react-component-library/src/functions/makeAllStyles.ts

Line 59 in eac54e2

strokeWidth: chartStyle?.tooltipTextStyle?.size ?? 0.25,

Also a couple of visual examples:

tooltipTextStyle.size = 0.6

tooltipTextStyle = 3

[eatyourpeas]

Yes @dmc-cambric very happy to do this. Just looking at the styling of your screenshots though slightly troubled by the fact that the font in your tooltips looks to be Times New Roman, not Montserrat (see #76). Is that a deliberate choice or is the default styling in the package not working for you? Different fonts have different spacing which is set within the Victory package on which the charts are build, and this should work for Montserrat as the Victory maintainers kindly accepted a PR from us to include it.

[eatyourpeas]

This should be fixed in the next update:

toolTipMain: {
            textAnchor: "start",
            fontSize: chartStyle?.tooltipTextStyle?.size ?? 10,
            strokeWidth: 0.25,
            fill: chartStyle?.tooltipTextStyle?.colour ?? black,
            fontFamily: chartStyle?.tooltipTextStyle?.name ?? 'Montserrat',
            fontWeight: chartStyle?.tooltipTextStyle?.weight ?? 'normal',
        },

[eatyourpeas]

Fixed and merged in v7.0.0. Documentation updated