2013-04-26 18 views
19

ho la costruzione di un grafico a torta utilizzando la libreria Highcharts, e qui è la mia tabella:Disabilita hover su Highcharts

// http://jsfiddle.net/t2MxW/20890/ 

    var chart = new Highcharts.Chart({ 
     colors: ['#0072BC', '#BFDAFF', '#DDDF00', '#24CBE5', '#64E572', '#FF9655', '#FFF263', '#6AF9C4'], 
     credits: { enabled: false }, 
     chart: { 
       renderTo: 'container', 
       backgroundColor: 'rgba(255, 255, 255, 0.1)', 
       type: 'pie', 
       margin: [0, 0, 0, 0], 
       spacingTop: 0, 
       spacingBottom: 0, 
       spacingLeft: 0, 
       spacingRight: 0 
     }, 
     title: { text: null }, 
     plotOptions: { 
       pie: { 
        allowPointSelect: false, 
        size: '100%', 
        dataLabels: { enabled: false } 
       } 
     }, 
     series: [{ 
       showInLegend: false, 
       type: 'pie', 
       name: 'Pie Chart', 
       data: [ 
        ['Mobile', 65], // first half of pie 
        ['Other', 35] // second half of pie 
       ] 
     }] 
    }); 

Ma il problema è che io non voglio apparire tooltip al passaggio del mouse ...

E 'possibile disabilitare la descrizione del comando al passaggio del mouse?

risposta

39

è necessario impostare l'attributo tooltip-false, in questo modo:

tooltip: { enabled: false }, 

jsFiddle here


Ecco il codice completo per il vostro caso:

var chart = new Highcharts.Chart({ 
     colors: ['#0072BC', '#BFDAFF', '#DDDF00', '#24CBE5', '#64E572', '#FF9655', '#FFF263', '#6AF9C4'], 
     credits: { enabled: false }, 
     tooltip: { enabled: false }, 
     chart: { 
       renderTo: 'container', 
       backgroundColor: 'rgba(255, 255, 255, 0.1)', 
       type: 'pie', 
       margin: [0, 0, 0, 0], 
       spacingTop: 0, 
       spacingBottom: 0, 
       spacingLeft: 0, 
       spacingRight: 0 
     }, 
     title: { text: null }, 
     plotOptions: { 
       pie: { 
        allowPointSelect: false, 
        size: '100%', 
        dataLabels: { enabled: false } 
       } 
     }, 
     series: [{ 
       showInLegend: false, 
       type: 'pie', 
       name: 'Pie Chart', 
       data: [ 
        ['Mobile', 65], // first half of pie 
        ['Other', 35] // second half of pie 
       ] 
     }] 
}); 
+0

Spiacente ho cambiato il mio link per jsFiddle perché era sbagliato ... ho un grafico a torta d questo codice sembra non funzionare lì - potresti guardarci di nuovo? – Vytalyi

+0

@Vytalyi Aggiornato, controlla il mio nuovo jsFiddle. – lifetimes

+1

Ok: impostazione del tooltip su false opere perfette! Grazie!!! – Vytalyi

4

È può semplicemente girarli di utilizzare il seguente:

tooltip: { 
    enabled: false  
}, 
2

si può semplicemente disabilitarlo impostando l'opzione

tooltip:{ 
    enabled: false 
} 
41

Disattivazione tooltip solo disabilita il tooltip ma l'effetto hover è ancora presente. Per disabilitare effetto hover, aggiungere il seguente ai vostri plotOptions:

plotOptions: { 
     series: { 
      states: { 
       hover: { 
        enabled: false 
       } 
      } 
     } 
    }, 
+2

Funziona bene, grazie! –

+2

quando ho avuto un piechart, questo ha reso il mio grafico nulla al passaggio del mouse. ottima risposta, l'altro tooltip abilitato falso ha comunque reso il mio grafico hoverable .. –