JSFiddle - React, Tailwind, and code Playground

by Muhammad Mushtaq Sheikh

HTML

<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>

<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
<div id="tooltipstatus">Tooltip is hidden: true</div>

JavaScript

$(function() {
  (function(H) {
    H.wrap(H.Tooltip.prototype, 'hide', function(defaultCallback) {
      //alert();
      //if ( /* .. */ ) {
      ////Do Nothing (Do Not Hide)
      //} else { // Call the default Hide Callback
      //defaultCallback.apply(this);
      //}
    });

    H.wrap(H.Tooltip.prototype, 'click', function(defaultCallback) {
      alert('click');

    });

    //Highcharts.wrap(Highcharts.Tooltip.prototype, 'refresh', function(proceed, point, event, click) {
    // if (click) {
    //   proceed.apply(this, Array.prototype.slice.call(arguments, 1));
    //  }
    //});
  }(Highcharts));
  $('#container').highcharts({
    series: [{
      data: [3.9, 4.2, 5.7, 8.5, 11.9, 15.2, 17.0, 16.6, 14.2, 10.3, 6.6, 4.8]
    }]
  });

  var chart = $('#container').highcharts();

  setInterval(function() {
    $("#tooltipstatus").html("Tooltip is hidden: " + chart.tooltip.isHidden);
  }, 1000);
});