title: How can I hide tooltip in Chart.js on a specific data label?
body: <p>I am trying to hide a tooltip in <a href="https://en.wikipedia.org/wiki/Chart.js" rel="nofollow noreferrer">Chart.js</a> whenever the name of a clicked object is &quot;Something&quot;. I have already tried this:</p>
  <pre><code>  this.doughnutChart = new Chart(this.doughnutCanvas.nativeElement, {
    type: 'doughnut',
    data: {
      datasets: [{
        label: _.map(this.dataService.AmTimeSlots, 'ProjectName'),
        data: _.map(this.dataService.AmTimeSlots, 'Duration'),
        backgroundColor: _.map(this.dataService.AmTimeSlots, 'Color'),
        hoverBackgroundColor: _.map(this.dataService.AmTimeSlots, 'HoverColor'),
        borderColor: _.map(this.dataService.AmTimeSlots, 'BorderColor'),
        borderWidth: 1.5
      },
      {
        label: _.map(this.dataService.PmTimeSlots, 'ProjectName'),
        data: _.map(this.dataService.PmTimeSlots, 'Duration'),
        backgroundColor: _.map(this.dataService.PmTimeSlots, 'Color'),
        hoverBackgroundColor: _.map(this.dataService.PmTimeSlots, 'HoverColor'),
        borderColor: _.map(this.dataService.PmTimeSlots, 'BorderColor'),
        borderWidth: 1.5
      }],
    },
    options: {
      elements: {
        arc: {
          roundedCornersFor: 0
        }
      },
      segmentShowStroke: false,
      responsive: true,
      maintainAspectRatio: true,
      legend: {
        display: false
      },
      onClick: this.chartClick.bind(this),
      cutoutPercentage: 65,
      tooltips: {
        filter: function (tooltipItem) {
          if (tooltipItem.xLabel == &quot;Free Slot&quot;) {
            return false;
          } else {
            return true;
          }
        },
        callbacks: {
          label: function (tooltipItems, data) {
          return data.datasets[tooltipItems.datasetIndex].label[tooltipItems.index];
          },
          afterLabel: function (tooltipItems, data) {
          return Math.floor(data.datasets[tooltipItems.datasetIndex].data[tooltipItems.index] / 6) + 'h ' + data.datasets[tooltipItems.datasetIndex].data[tooltipItems.index] * 10 % 60 + 'm';
          }
        }
      }
    },
    config: {
      data: this.dataService,
      settings: this.settingsService
    }
  });
  </code></pre>
  <p>And this code above is working fine. It’s successfully hiding the text of tooltip, but the problem is that the black label/border still remains. How can I hide it?</p>