2013-08-28 70 views
3

我想從我的堆積柱狀圖在Highcharts中刪除0值。看看這個:在Highcharts中的堆積柱狀圖中隱藏0個值

http://jsfiddle.net/4NxYh/

在 「15.08」。你看到最高價值爲「0」,這是非常混亂。我怎樣才能隱藏這個?

如何隱藏「14.08」中最上面的「1」的「低」值。這樣它不會溢出該區域?

這是我使用的代碼:

chartOptions = { 
     chart: { 
      type: 'column' 
     }, 
     title: { 
      text: '' 
     }, 
     xAxis: { 
      categories: ["14.08","15.08","16.08","17.08","18.08","19.08","20.08","21.08","22.08","23.08","24.08","25.08","26.08","27.08","28.08"] 
     }, 
     yAxis: { 
      min: 0, 
      title: { 
       text: '' 
      }, 
      endOnTick: false, 
      maxPadding: 0.0, 
      stackLabels: { 
       enabled: true, 
       style: { 
        fontWeight: 'bold', 
        color: (Highcharts.theme && Highcharts.theme.textColor) || 'gray' 
       } 
      }, 
      allowDecimals: false 
     }, 
     legend: { 
      align: 'right', 
      x: 0, 
      verticalAlign: 'top', 
      y: 0, 
      floating: true, 
      backgroundColor: (Highcharts.theme && Highcharts.theme.legendBackgroundColorSolid) || 'white', 
      borderColor: '#CCC', 
      borderWidth: 1, 
      shadow: false 
     }, 
     tooltip: { 
      formatter: function() { 
       return '<b>' + this.x + '</b><br/>' + 
        this.series.name + ': ' + this.y + '<br/>' + 
        'Gesamt: ' + this.point.stackTotal; 
      } 
     }, 
     plotOptions: { 
      column: { 
       stacking: 'normal', 
       dataLabels: { 
        enabled: true, 
        color: (Highcharts.theme && Highcharts.theme.dataLabelsColor) || 'white' 
       }, 
       treshold: 1 
      } 
     }, 
     series: [{"name":"a","data":[1,0,0,0,0,0,0,0,0,0,1,0,0,0,0],"_colorIndex":0},{"name":"b","data":[92,91,65,56,102,146,146,86,117,115,103,108,137,134,19],"_colorIndex":1},{"name":"c","data":[13,4,3,1,5,13,2,4,2,2,3,3,2,8,0],"_colorIndex":2},{"name":"d","data":[3,6,1,4,3,6,3,2,1,6,3,3,0,6,1],"_colorIndex":3},{"name":"e","data":[41,19,8,16,30,32,46,19,17,11,15,13,52,30,2],"_colorIndex":4},{"name":"f","data":[5,2,3,2,5,3,4,2,3,2,1,3,4,12,1],"_colorIndex":5},{"name":"g","data":[70,80,77,72,77,94,80,60,52,75,49,84,74,72,12],"_colorIndex":6},{"name":"h","data":[0,1,0,0,0,0,0,0,0,0,2,0,0,0,0],"_colorIndex":7},{"name":"i","data":[0,1,1,0,0,0,0,0,0,0,0,0,1,0,0],"_colorIndex":8},{"name":"j","data":[0,0,2,0,0,1,0,1,1,1,0,4,2,1,0],"_colorIndex":0},{"name":"k","data":[0,0,0,0,0,1,1,1,0,0,0,0,0,0,0],"_colorIndex":1}] 
    }; 
container = $('#chart'); 
container.highcharts(chartOptions); 

回答

7

您可以使用label.formatter,例如:http://jsfiddle.net/Fusher/4NxYh/4/

  formatter: function(){ 
       console.log(this); 
       var val = this.y; 
       if (val < 6) { 
        return ''; 
       } 
       return val; 
      }, 
+0

該訣竅。但我調整了這個'if(this.y/this.total <0.05)'檢查不是一個絕對值,但百分比。所以在這個例子中,我隱藏了值,當它們小於5% – Stefan