JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://npmcdn.com/chart.js/dist/Chart.js"></script>
<canvas id="canvas"></canvas>
<button onClick="openTip(oChart,0,2)">
Open March
</button>
<button onClick="closeTip(oChart,0,2)">
Close March
</button>

JavaScript

function openTip(oChart,datasetIndex,pointIndex){
   if(oChart.tooltip._active == undefined)
      oChart.tooltip._active = []
   var activeElements = oChart.tooltip._active;
   var requestedElem = oChart.getDatasetMeta(datasetIndex).data[pointIndex];
   for(var i = 0; i < activeElements.length; i++) {
       if(requestedElem._index == activeElements[i]._index)  
          return;
   }
   activeElements.push(requestedElem);
   oChart.tooltip._active = activeElements;
   oChart.tooltip.update(true);
   oChart.draw();
}

function closeTip(oChart,datasetIndex,pointIndex){
   var activeElements = oChart.tooltip._active;
   if(activeElements == undefined || activeElements.length == 0)
     return;
   var requestedElem = oChart.getDatasetMeta(datasetIndex).data[pointIndex];
   for(var i = 0; i < activeElements.length; i++) {
       if(requestedElem._index == activeElements[i]._index)  {
          activeElements.splice(i, 1);
          break;
       }
   }
   oChart.tooltip._active = activeElements;
   oChart.tooltip.update(true);
   oChart.draw();
}

var barChartData = {
  labels: ["January", "February", "March", "April", "May", "June", "July"],
  datasets: [{
    label: 'Dataset 1',
    backgroundColor: 'rgb(255, 99, 132)',
    data: [10, 20, 30, 40, 50, 60, 70]
  }]
};

var ctx = document.getElementById("canvas").getContext("2d");
window.oChart = new Chart(ctx, {
  type: 'bar',
  data: barChartData,
  options: {
    tooltips: {
      mode: 'label'
    },
    responsive: true
  }
});

window.openTip = openTip;
window.closeTip = closeTip;