hally9k hally9k - 1 month ago 7
Javascript Question

Highcharts; disabling the tooltip for a single point renders a random little box

I have been utilising the react-highcharts wrappers for highcharts.

I am using the following snippet to disable the tooltip for a point in my series for a donut chart.

...
tooltip: {
formatter: function(){
if (this.point.tooltipEnabled) {
return this.series.name;
}
return false;
}
},
...


But when the formatter returns false the very first time it is called highcharts renders a random little box in the top left hand corner like this...

enter image description here

If I hover the blue one first it doesnt show the little box on subsequently hovering the grey though.

Any ideas?

Answer

It is a bug which appeared in Highcharts 5. Reported here.

Use the latest development version:

<script src="http://github.highcharts.com/master/highcharts.src.js"></script>

or the previous version:

<script src="http://code.highcharts.com/4.2.7/highcharts.js"></script>

http://jsfiddle.net/p9mwgs18/3/