[ChartJS] unable to configure tootlip label callback

[coderpauloo]

[ChartJS] unable to configure tootlip label callback

[coderpauloo]

Thanks a lot for your help and explanations, I managed to make it work the way I needed to :)

Have a nice day !

[smnandre]

I don't think you can write JS code in PHP.

You probably should use a custom stimulus controller and define the callback on initialization

--> https://symfony.com/bundles/ux-chartjs/current/index.html#extend-the-default-behavior

[coderpauloo]

ok thanks, I'll try this way but it still feels weird the php configuration does not cover this part of the features

[coderpauloo]

I tried your solution by creating this custom controller :

`
//piechart_controller.js
import { Controller } from '@hotwired/stimulus';

export default class extends Controller {
connect() {
this.element.addEventListener('chartjs:pre-connect', this._onPreConnect);
}

disconnect() {
    this.element.removeEventListener('chartjs:pre-connect', this._onPreConnect);
}

_onPreConnect(event) {
    const chart = event.detail.chart;
    console.log('here');
    chart.config.options.plugins.tooltip.callbacks.label = function(context) {
      return 'test';
    };

    chart.update();
}

}
`

twig :

{{ render_chart(expensesDistributionChart, {'data-controller': 'piechart'}) }}

But I can't manage to make this work, I don't even see my console.log, would you have any example of detailed documentation about how to set this up please ?

[smnandre]

You must update the config and not the chart, as it's not yet created in the preConnect event

https://symfony.com/bundles/ux-chartjs/current/index.html#extend-the-default-behavior

   _onPreConnect(event) {
        // The chart is not yet created
        // You can access the config that will be passed to "new Chart()"
        console.log(event.detail.config);
        
        // ...

This should work better

[smnandre]

I'm glad if i can help :)

Happy coding!