buttonwillowsix
Posts: 6
Joined: Thu Jul 20, 2017 7:24 pm

Styling Tooltips

Fri Jul 28, 2017 5:51 pm

Hi! I want to increase the font size on the tooltips for a pie chart, but am having a hard time figuring it out.

kamil
Posts: 439
Joined: Tue May 30, 2017 9:12 am

Re: Styling Tooltips

Sun Jul 30, 2017 11:29 am

Hi buttonwillowsix,

One of the ways to change tolltip's font-size is using tooltip.style.fontSize property.

Best regards!

Example: http://jsfiddle.net/kkulig/6qwoozde/
API Reference: http://api.highcharts.com/highcharts/tooltip.style
Kamil Kulig
Highcharts Developer

buttonwillowsix
Posts: 6
Joined: Thu Jul 20, 2017 7:24 pm

Re: Styling Tooltips

Wed Aug 02, 2017 3:29 am

Hi!
So I need to do that in the custom code section? I tried to follow the example, and came up with the following, but it didn't seem to have any effect.

Highcharts.extend(options, Highcharts.merge(options, {
plotOptions: {
"tooltip": {
"style": {
"fontSize": "50px"
}
}
}
}));

kamil
Posts: 439
Joined: Tue May 30, 2017 9:12 am

Re: Styling Tooltips

Wed Aug 02, 2017 8:41 am

Hi!

Notice that tooltip is chart's property (not plotOptions'). In Highcharts Cloud this code worked for me:

Code: Select all

Highcharts.extend(options, Highcharts.merge(options, {
    tooltip: {
        style: {
        	fontSize: "50px"
        }
    }
}));
Please make sure that your code is not commented.

Best regards!

API reference: http://api.highcharts.com/highcharts/tooltip
Kamil Kulig
Highcharts Developer

buttonwillowsix
Posts: 6
Joined: Thu Jul 20, 2017 7:24 pm

Re: Styling Tooltips

Wed Aug 02, 2017 8:57 pm

Thanks! This fixed my issue!

Return to “Highcharts Cloud”