ハイチャートスタックされた列：スタックが隠されたときの合計を表示

Question

私は、1列に3つのスタックを持つ積み上げ縦棒グラフを持っています。 https://jsfiddle.net/Lfvnraqd/1/

ツールチップには、個々のスタックの数と3つのスタック全体の合計（つまり、すべての手続きの合計）が表示されます。すべてのスタックが表示されている限り、これは正常に動作します。しかし、凡例の対応する項目をクリックして1つまたは2つのスタックを隠すと、ツールヒントに表示される合計は表示されるすべてのスタックの合計になりますが、3つのスタック全体の合計が表示されます。可能であれば、総数のために別のシリーズを持つ必要はありません。

これを行う方法はありますか？

コード：チャートが表示データにのみ動作するための値を手動で行う必要がある点の

$(function() { 
Highcharts.setOptions({ 
    colors: ['#f59000', '#2274c1', '#90aaef'] 
}); 
$('#container').highcharts({ 
chart: { 
    borderColor: '#cccccc', 
    borderWidth: 2, 
    marginTop: 43, 
    type: 'column' 
    }, 
xAxis: { 
     categories: ['2004', '2005', '2006', '2007', '2008', '2009', '2010', '2011', '2012', '2013', '2014', '2015'], 
     tickLength: 20 
    }, 
    yAxis: { 
     min: 0, 
     max: 45, 
     reversedStacks: false, 
     tickInterval: 5, 
     title: { 
      text: null 
     }, 
     stackLabels: { 
      enabled: true, 
      style: { 
       fontWeight: 'bold', 
       color: (Highcharts.theme && Highcharts.theme.textColor) || 'black' 
      } 
     } 
    }, 
    credits: { 
     enabled: false 
    }, 
    title: { 
    text: 'Number of procedures per year', 
    y: 18 
    }, 
tooltip: { 
     headerFormat: '<b>Year {point.x}</b><br/>', 
     pointFormat: '{series.name}: {point.y}<br/>Total procedures: {point.stackTotal}' 
    }, 
plotOptions: { 
     column: { 
      stacking: 'normal', 
      dataLabels: { 
       enabled: true, 
       color: (Highcharts.theme && Highcharts.theme.dataLabelsColor) || 'white' 
      } 
     } 
    }, 
series: [{ 
     name: 'Resolved before conciliation', 
     data: [14, 12, 10, 13, 10, 7, 11, 11, 11, 8, 8, 10] 
    }, { 
     name: 'Conciliation successful', 
     data: [2, 4, 5, 1, 2, 7, 6, 4, 1, 1, 3, 0] 
    }, { 
     name: 'Expert\'s decision', 
     data: [7, 13, 20, 10, 20, 19, 20, 26, 25, 19, 18, 17] 
    }] 
}); 
}); 

Answer 1

サミング。

あなたがグラフ内のデータを設定する前に、あなたがその合計を計算：

var data1 = [14, 12, 10, 13, 10, 7, 11, 11, 11, 8, 8, 10]; 
var data2 = [2, 4, 5, 1, 2, 7, 6, 4, 1, 1, 3, 0]; 
var data3 = [7, 13, 20, 10, 20, 19, 20, 26, 25, 19, 18, 17] 

var sums = Object.keys(data1).map(i => { 
    return data1[i] + data2[i] + data3[i]; 
}); 

とtooltip.pointFormatter

pointFormatter: function() { 
    return this.series.name + ': ' + this.y + '<br/>Total procedures: ' + sums[this.x]; 
} 

例でpropert和にアクセス：https://jsfiddle.net/Lfvnraqd/2/