I'm trying to customize the ticks labels by adding the $ sign before the actual value in a bar chart via Laravel Charts.
In chartjs docu (https://www.chartjs.org/docs/2.7.3/axes/labelling.html#creating-custom-tick-formats) it's described to do it like this:
var chart = new Chart(ctx, {
type: 'line',
data: data,
options: {
scales: {
yAxes: [{
ticks: {
// Include a dollar sign in the ticks
callback: function(value, index, values) {
return '$' + value;
}
}
}]
}
}
I'm struggling with the callback function because I don't know how to do this in the chart controller - currently it looks like this (I just put it as a js formatted string), but it doesn't work:
$this->chart->options([
'maintainAspectRatio' => false,
'showLines' => false,
'scales' => [
'xAxes' => [],
'yAxes' => [
[
'ticks' => [
'display' => true,
'callback' => "{function(value, index, values) {
return '$' + value;
}}",
],
],
],
],
]);
It was my first time working with charts in backpack, but after some trials I was able to fix it by using rawObject:
and in js:
while currencyLable looks like this: