Chart JS Custom tooltips with % and label for X and Y axles

👍:0

You might be pulling my leg here because nothing fancy is needed, just add + ” %” at the end of label function return:

    options: {
    
    tooltips: {
        callbacks: {
            label: function(tooltipItem, data) {
                return "Energi, Vatten och Återvinning: " + Number(tooltipItem.yLabel).toFixed(0).replace(/./g, function(c, i, a) {
                    return i > 0 && c !== "." && (a.length - i) % 3 === 0 ? "," + c : c;
                })+ " %";
            }
        }
    },

Also, it seems to me your entire function can at least be reduced to:

    options: {
    
    tooltips: {
        callbacks: {
            label: function(tooltipItem, data) {
                return "Energi, Vatten och Återvinning: " +  Number(tooltipItem.yLabel).toFixed(0)+ " %";
            }
        }
    },

Leave a comment