Tooltip options not working
Jack2104 opened this issue · 2 comments
Jack2104 commented
I'm trying to set tooltip options and use callbacks, and they aren't doing anything.
As you can see in the below code, I set the caret size to 0 pixels and also add a title callback. However, on my chart, the caret size stays normal and the callback is not run - "test" is not printed to the console, despite the console.log("test")
const chart = {
id: 'chart',
type: 'bubble',
options: {
maintainAspectRatio: false,
tooltips: {
caretSize: 0,
callbacks: {
title: (tooltipItem, data) => {
console.log("test");
let dataPoint = data["datasets"][tooltipItem["datasetIndex"]][tooltipItem["dataIndex"]];
let satelliteAName = dataPoint["satelliteA"]["OBJECT_NAME"];
let satelliteBName = dataPoint["satelliteB"]["OBJECT_NAME"];
return satelliteAName + " and " + satelliteBName;
},
label: (tooltipItem, data) => {},
afterLabel: (tooltipItem, data) => {},
},
}
},
data: {
datasets: [
{
label: 'Velocity < x',
data: conjunctionData,
backgroundColor: 'rgb(255, 99, 132)'
}
]
}
}
Does anyone know what might be happening?
J-T-McC commented
Tooltip configs are under the options.plugins key in ChartJS 3. https://www.chartjs.org/docs/latest/configuration/tooltip.html#tooltip-configuration
Example:
options: {
plugins: {
tooltip: {
enabled: true,
callbacks: {
title() {
return 'WOOOOOOOOOOOOOOOO'
}
}
}
}
}