Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to enable or disable a Highcharts tooltip when a button is clicked?

This is what I've tried:

$("#toollip").click(function(){
    if(chart.container.tooltip.enabled ){
        chart.container.tooltip.enabled = false;
    }else{
        chart.container.tooltip.enabled  = true;
    }
});
like image 994
Younes Avatar asked Dec 04 '22 01:12

Younes


1 Answers

I looked through a lot of forums and nowhere I found very easy way to show/hide a Tooltip like tooltip.enable = true/false. The good way I came to is to set tooltip setting through Formatter in the initialization of chart.

var barsShowen - is a global variable that has a necessary state - true/false - show Tooltip or not.

tooltip: {
  shared: true,
  useHTML: true,
  formatter: function () {
    if (barsShowen) {
      var s = '<span><b>' + this.x + '</b></span><table>';
      $.each(this.points, function () {
        s += '<tr><td align = "left" style = "color:' + this.series.color + ';">' + this.series.name + ': ' + '</td>' +
          '<td><b>' + this.y + '</b></td></tr>';
      });
      return s + '</table>';
    } else {
      return false;
    }
  }
like image 95
Kirill Ch Avatar answered Jan 03 '23 19:01

Kirill Ch