Div element not hiding even after hiding the tooltip in highcharts

Question

I basically want to hide the tooltip on click anywhere in the chart. For this I have configured tooltip as follows:

 tooltip:{
           hideDelay: 50000 //So that the tooltip stays open for a long time
 }

You can check out the example at:

http://jsfiddle.net/e56KT/16/

Anyone with bright ideas!!!

Updated Question:

Before hiding the tooltip:

After hiding the tooltip:

As you can see the div element si not hiding even after hiding the tooltip by the method you described. In a series chart, if we customize the tooltip with increased width and height, the mouse over on other markers doesn't work as this div element stays on top of those markers.

Mark Mark · Accepted Answer · 2014-06-16T16:43:31

Your code is actually working. It appears not to though because the hide method honors the hideDelay. If you want it to hide immediately try:

hideTooltip = function(){
    chart.tooltip.label.fadeOut();
    chart.tooltip.isHidden = true;
}

This is what the hide method does internally.

Finally, if you want it to hide if you click anywhere on the chart then I'd hook both the chart: events: click event and the plotOptions: events: click event.

See updated fiddle here.

Div element not hiding even after hiding the tooltip in highcharts

1 Answers