CODEWITHSUNDEEP
javascriptjqueryhighcharts
Mohamed Yakout
Mohamed Yakout

Reputation: 3036

disable hover on special slice of pie chart

I know how to disable hover on highcharts, and I edit the answer to disable hove on special slice as this demo, but it doesn't work.

I edit series attribute as the following: 

series: [{
  showInLegend: false,
  type: 'pie',
  name: 'Pie Chart',
  data: [
    ['Mobile', 65], // first half of pie
    {
       name: 'Other', 
       y: 35, 
       tooltip: { enabled: false }
    } // second half of pie
  ]

How can I disable hover for special slices on pie charts using highcharts ?

Upvotes: 2

Views: 2723

Answers (1)

MorKadosh
MorKadosh

Reputation: 6006

You were pretty close with your custom tooltip property idea. I personally rather using custom names as well, therefor instead of adding a tooltip data object, i'd use a custom property named tooltipDisabled:

{name: 'Other', y: 35, tooltipDisabled:true} // second half of pie

And then, using a tooltip formatter function (a callback function called when a point is hoverd, which is totally override-able), I'd discriminate the points with this property:

    tooltip: {
        useHTML:true,
        formatter: function(){
            return this.point.tooltipDisabled ? false : this.point.name +"<br><span style='font-size:18px;vertical-align:middle'>&#8226;</span>"+this.series.name+": <b>"+this.y+"</b>";
        }

returning false, as you have probably guessed, disables the tooltip. (as you can see I also added useHTML:true, so highcharts renders the bullet next to the point name.

See fiddle: http://jsfiddle.net/e7brd9do/2/

Upvotes: 2

Related Questions