[Chartjs]-How can I customize p:polarAreaChart tooltips?

by

2👍

✅

I added a script section to my xhtml with the following JS code:

<h:outputScript>
    function configurePolarChart() {
        let options = $.extend(true, {}, this.cfg.config).options
        options.tooltips = {
            callbacks: {
                label: function(tooltipItem) {
                    switch (tooltipItem.index) {
                        case 0:
                            return "Lower-Temperature"
                        case 1:
                            return "Upper-Temperature"
                        case 2:
                            return "Height"
                        case 3:
                            return "Weight"
                        case 4:
                            return "Length"
                        case 5:
                            return "Age"
                        default:
                            return "";
                    }
                }
            }
        }
        this.cfg.config.options = options
    }
</h:outputScript>

corresponding to the 6 values in my data. I also added 

polarAreaModel.setExtender("configurePolarChart");

to my .java file while creating polar area chart. Now it displays custom tooltips for each item in the chart.

Leave a comment