Label Color same as backgroundColor – ChartJS

πŸ‘:1

You don’t have a callback for the tooltip title color so it’s not possible with an easy way.

One option would be to use labelTextColor but this changes the title AND the value (full JSBin example here).

tooltips: {
  callbacks: {
    labelTextColor: function(tooltipItem, chart) {
      return colors[tooltipItem.index];
    }
  },
  titleFontSize: 20,
  bodyFontSize: 24,
  displayColors: false
}

Another option would be a custom tooltip. Here is a great answer to a similar question with a very nice codepen example.

Leave a comment