Chartjs 条形图为值标签添加背景颜色

Question

I have bar charts with value on top using chartjs-plugin-labels , and some values bumping to each other as image shown below on highlighted values

How do I add background color to the values or is there any other nice solutions?

Answer 1

you can user plugin option of chart js as per below code.

plugins: {
      
      datalabels: {
        color: "#000",
        backgroundColor: "#f0f0f0",
        font: {
          weight: "bold",
          size: 12
        },
        formatter: Math.round,
        anchor: "end",
        offset: -20,
        align: "start"
      },
    }
}

https://www.npmjs.com/package/chartjs-plugin-datalabels => You can use this plugin

https://www.npmjs.com/package/chartjs-plugin-labels => This is very old plugin