0👍
✅
Chart js supported plugins page does have a solution for it, it is this plugin chartjs-plugin-datalabels . Make sure you import the module in main.js as like
import labels from 'chartjs-plugin-datalabels';
and then
Vue.use(labels)
and update your Vue page :
this.options = {
plugins: {
labels: [
{
render: 'value',
}
],
},
};
Update: A easier to use module/plugin as mentioned by @zb22 is plugin chartjs-plugin-labels
If you are using vue just import it in your Vue component like
import 'chartjs-plugin-labels';
and use it like
this.options = {
plugins: {
labels: [
{
render: 'percentage',
fontColor: ['green', 'white', 'red'],
precision: 2,
}
],
},
};
2👍
You can use a plugin to achieve this:
https://github.com/emn178/chartjs-plugin-labels
It’s well known for this purpose.
This is a demo
Source:stackexchange.com