I'm using react-chartjs-2 library to make simple charts in React. I tried to customize a bit the tooltip by adding a title:
tooltips: {
callbacks: {
label: (tooltipItem, data) => {
return tooltipItem?.value + ' test';
}
}
}
The code Sandbox: https://codesandbox.io/s/zealous-mestorf-ste8u
The code doesn't work although I followed the chart.js example and also many other custom tooltip example (i.e answer from this question: React-chartjs-2: Pie Chart tooltip percentage
).
You are using v2 syntax while using v3 so the option name and place where wrong, also your scale config was wrong, it should look like this:
const option = {
plugins: {
tooltip: {
callbacks: {
title: function () {
return "my tittle";
}
}
},
legend: { display: false },
title: {
display: true,
text: "Test chart",
position: "top"
}
},
scales: {
y: {
beginAtZero: true
}
}
};
For more information about changes between v2 and v3 please check the migration guide