하이 차트 스택 컬럼 카테고리 당 총 데이터

Question

카테고리 당 총 데이터를 가져오고 싶습니다. point.stackTotal은 활성 데이터의 합계만을 제공합니다.

붙여 넣은 코드 예제에서 과일당 총 소비량을 알고 싶습니다. 그래서 오른쪽 위 부분에있는 전설에서 Joe의 이름을 클릭 했더라도 (즉, 누적 된 차트에 대한 모든 Joe의 정보가 비활성 상태 임), John, Jane 및 Joe의 Apple 및 기타 과일의 총 소비량은 mouseover 각 막대 범주는 그래서 분명히, 내가 무엇을 찾고 point.stackTotal되지 않습니다.

$(function() { 
    Highcharts.chart('container', { 
     chart: { 
      type: 'column' 
     }, 
     title: { 
      text: 'Stacked column chart' 
     }, 
     xAxis: { 
      categories: ['Apples', 'Oranges', 'Pears', 'Grapes', 'Bananas'] 
     }, 
     yAxis: { 
      min: 0, 
      title: { 
       text: 'Total fruit consumption' 
      }, 
      stackLabels: { 
       enabled: true, 
       style: { 
        fontWeight: 'bold', 
        color: (Highcharts.theme && Highcharts.theme.textColor) || 'gray' 
       } 
      } 
     }, 
     legend: { 
      align: 'right', 
      x: -30, 
      verticalAlign: 'top', 
      y: 25, 
      floating: true, 
      backgroundColor: (Highcharts.theme && Highcharts.theme.background2) || 'white', 
      borderColor: '#CCC', 
      borderWidth: 1, 
      shadow: false 
     }, 
     tooltip: { 
      headerFormat: '<b>{point.x}</b><br/>', 
      pointFormat: '{series.name}: {point.y}<br/>Total: {point.stackTotal}' 
     }, 
     plotOptions: { 
      column: { 
       stacking: 'normal', 
       dataLabels: { 
        enabled: true, 
        color: (Highcharts.theme && Highcharts.theme.dataLabelsColor) || 'white' 
       } 
      } 
     }, 
     series: [{ 
      name: 'John', 
      data: [5, 3, 4, 7, 2] 
     }, { 
      name: 'Jane', 
      data: [2, 2, 3, 2, 1] 
     }, { 
      name: 'Joe', 
      data: [3, 4, 4, 2, 5] 
     }] 
    }); 
}); 

Answer 1

stackLabels.formatter 함수를 사용하여 카테고리에 대해 표시되고 숨겨진 모든 열에 대한 총 값을 표시 할 수 있어야한다고 생각합니다. 당신은 Highcharts API에 stackLabels에 대한 자세한 정보를 얻을 수 있습니다 : 여기 http://api.highcharts.com/highcharts/yAxis.stackLabels.formatter

stackLabels: { 
    enabled: true, 
    style: { 
     fontWeight: 'bold', 
     color: (Highcharts.theme && Highcharts.theme.textColor) || 'gray' 
    }, 
    formatter: function() { 
     var x = this.x, 
     value = 0; 

     series = this.axis.series; 
     Highcharts.each(series, function(s) { 
     value += s.userOptions.data[x]; 
     }); 
     return value; 
    } 
    } 

당신은 당신이 필요 차트 비슷한 달성 할 수있는 방법을 매우 간단한 예를 볼 수 있습니다 http://jsfiddle.net/h8f30uwo/

베스트,