[Chartjs]-Chart.js Tooltips customization

by

2👍

✅

Well, you can change the tooltip template option :
By default it is : 

tooltipTemplate: "<%if (label){%><%=label%>: <%}%><%= value %>"

Change it to be tooltipTemplate: "<%if (label){%><%=label%>: <%}%><%= value %>%" in the option object you give to create your chart.

I used it because I wanted to show the user a percentage that is not proportional to the size on my chart (My donut chart represent a process, and some process take less time than others so the size isn’t the same for all of them)

The exact example you gave was with kb.
Here is the exact code I copy and paste from the index page from Chart.js :

var moduleDoughnut = new Chart(canvas.getContext('2d')).Doughnut(moduleData, { 
    tooltipTemplate : "<%if (label){%><%=label%>: <%}%><%= value %>kb",
    animation: false 
});

Leave a comment