2016-03-17 96 views
1

我試圖禁用tooltip for gauge,但無論我做什麼,它都不起作用。如何禁用highcharts gauge中的工具提示?

我設法安置:

tooltip: { 
    enabled: false 
} 

chartpaneseries ...

這裏是一個演示中,我使用:Fiddle

,這是一個代碼:

$('#container').highcharts({ 

     chart: { 
      type: 'gauge', 
      plotBackgroundColor: null, 
      plotBackgroundImage: null, 
      plotBorderWidth: 0, 
      plotShadow: false, 
      tooltip: { 
      enabled: false 
      } 
     }, 
       exporting: {enabled: false}, 
     title: { 
      text: 'meetings', 
      //align: 'bottom' 
      verticalAlign: 'bottom', 
      y: 10, 
       style: { 
         fontWeight: 'bold', 
         fontSize:'18px' 
        } 
     }, 

     pane: { 
     tooltip: { 
      enabled: false 
      }, 
      startAngle: -150, 
      endAngle: 150, 
      background: [{ 
       backgroundColor: { 
        linearGradient: { x1: 0, y1: 0, x2: 0, y2: 1 }, 
        stops: [ 
         [0, '#FFF'], 
         [1, '#333'] 
        ] 
       }, 
       borderWidth: 0, 
       outerRadius: '109%' 
      }, { 
       backgroundColor: { 
        linearGradient: { x1: 0, y1: 0, x2: 0, y2: 1 }, 
        stops: [ 
         [0, '#333'], 
         [1, '#FFF'] 
        ] 
       }, 
       borderWidth: 1, 
       outerRadius: '107%' 
      }, { 
       // default background 
      }, { 
       backgroundColor: '#DDD', 
       borderWidth: 0, 
       outerRadius: '105%', 
       innerRadius: '103%' 
      }] 
     }, 

     // the value axis 
     yAxis: { 
     tooltip: { 
      enabled: false 
      }, 
      min: 0, 
      max: max, 

      minorTickInterval: 'auto', 
      minorTickWidth: 0, 
      minorTickLength: 0, 
      minorTickPosition: 'inside', 
      minorTickColor: '#666', 

      tickPixelInterval: 0, 
      tickWidth: 0, 
      tickPosition: 'inside', 
      tickLength: 0, 
      tickColor: '#666', 
      labels: { 
       step: 2, 
       rotation: 'auto' 
      }, 
      title: { 
       text: '', 
       y: 150, 
       style: { 
         fontWeight: 'bold', 
         fontSize:'18px' 
        } 
      }, 
      plotBands: [{ 
       from: 0, 
       to: color_threshold_values[0], 
       color: '#DA2626' 
      }, { 
       from: color_threshold_values[0], 
       to: color_threshold_values[1], 
       color: '#F19E26' 
      }, { 
       from: color_threshold_values[1], 
       to: color_threshold_max, 
       color: '#88A61F' 
      }] 
     }, 

     series: [{ 
      name: 'Count', 
      data: [data.count], 

      dataLabels: { 
      enabled:false, 
        borderColor: 'red', 
        borderWidth: 0, 
        padding: 5, 
        shadow: true, 
        style: { 
         fontWeight: 'bold', 
         fontSize:'25px' 
        } 
       }, 

     }] 

    }); 

任何想法?

回答

1

你可以只添加.highcharts-tooltip{opacity: 0;}

見小提琴http://jsfiddle.net/DIRTY_SMITH/dpyy732d/2/

+1

好,不透明度爲0表示DOM仍然存在,它不清楚way.Hanks反正 – snaggs

+0

@snaggs約瑟的回答是好,但是如果你'.highcharts -tooltip {display:none}'它不會存在大聲笑 –