Chartjs-How to set a custom tick format in chartjs options from laravel controller?

by

0👍

✅

It was my first time working with charts in backpack, but after some trials I was able to fix it by using rawObject:

$this->chart->options([
        'maintainAspectRatio' => false,
        'showLines' => true,
        'scales' => [
            'xAxes' => [],
            'yAxes' => [
                [
                    'ticks' => [
                        'display' => true,
                        'callback' => $this->chart->rawObject('euroLabel')
                    ],
                ],
            ],
        ],
        'legend' => [
            'display' => false
        ],
        'tooltips' => [
            'callbacks' => [
                'label' => $this->chart->rawObject('euroLabelTooltip')
            ]
        ]
    ]);

and in js:

function euroLabel(value, index, values) {
    return currencyLabels.format(value);
}

while currencyLable looks like this:

var currencyLabels = new Intl.NumberFormat('de-AT', {
    style: 'currency',
    currency: 'EUR',
    minimumFractionDigits: 0,
    maximumFractionDigits: 0
});

Leave a comment