I am using the laravel-charts package in Laravel 7. I added the datalabels plugin for chartjs into the Chart object like this:
$this->options = [
'responsive' => true,
'maintainAspectRatio' => false,
'legend' => [ 'display' => false ],
'plugins' => [
'datalabels' => [
'color' => 'white',
'weight' => 'bold',
'font' => ['size' => 14],
'formatter' => ''
]
]
In another version when I was using vue.js and vue-chartjs, I was able to format the lable using this:
plugins: {
datalabels: {
formatter: function(value, context) {
return '$' + Number(value).toLocaleString();
},
}
}
As you can see, the javascript is passed as a PHP array. I cannot figure out how to pass that formatter to my laravel-charts version.
Any help is greatly appreciated.
Laravel Charts
plugins
option has to be a string that's representing a plain Javascript object. I couldn't find any actual documentation, but you can read a related issue here "How to use ChartsJs plugin Datalabels js?".You'll have to pass it like this:
Will apply chartjs-plugin-datalabels options:
PS: The
weight
property has to be inside thefont
object like in my example.