I am making a stacked bar that looks like the following:
The spaces you see in between each bar are bars static-sized bars that are the color of the background. I used them because I could not figure out how to add a space between bars in chart.js. I am trying to figure out how to hide the tooltip for the static-sized gray bars. As of right now, my code shows a black tooltip that freezes until I refresh the page when I hover over a gray bar. Here is the code for hiding it so far:
filter: function(tooltipItem) {
return tooltipItem.dataset.backgroundColor[0] !== "#f5f5f5";
// if (tooltipItem.dataset.backgroundColor[0] == "#f5f5f5") {
// return false;
// }
// console.log(tooltipItem.dataset.backgroundColor);
// return true;
}
I figured out how to get this to work. I hid the labels based on the background-color of a bar.