AM Charts - Changing the colour of tooltip text

user_1100102 0
Viewed 8251

Can't figure out how I change the text colour of tooltips. For my column chart I tried:

 series.tooltip.label.fill = am4core.color("#FFFFFF");

But it doesnt work. Curious also how I do it for the pie charts? Is there one place that I can update to affect all chart types, or do each need to be handled independently?

amcharts
3 Answers

The tooltip label gets a calculated color that contrasts with the tooltip background. You need to set autoTextColor to false in order to the fill color to take effect.

series.tooltip.autoTextColor = false;
series.tooltip.label.fill = am4core.color("#FFFFFF");

The same is valid for pie charts.

You can create your own theme but that could be more than what you need.

You can use more than one theme, which allows you to use one default theme and then override just what you need:

am4core.useTheme(am4themes_animated);

am4core.useTheme(function customTheme (object) {
    // Identify the instances
    if (object instanceof am4core.Tooltip && object.label) {
        object.autoTextColor = false;
        object.label.fill = am4core.color("#FFFFFF");
    }
});
user_8033980

After a lengthy search, I got the Below Line of code as successful line

pieSeries.labels.template.fill = am4core.color("white");
user_80342750

I have added above line of code if you are using axis range you can use that however as I can see your problem please take a look below line of code will solve your problem

series.tooltip.getFillFromObject = false;
series.tooltip.label.propertyFields.fill = "color";
series.tooltip.background.propertyFields.stroke = "color";

https://www.amcharts.com/docs/v4/concepts/tooltips/

user_93015970
Related