chart.js2.7.2で積み上げ棒グラフ(bar)の総計値を出すプラグイン

概要

必要に迫られて書いたよ。
chart.jsでチャート作成時のplugisn項目に下記のような形で追加する。
使用する前に書かないと動かない気がする。

一応レーダーチャートとかに書いても総計が出るけど、凡例クリックするとうまくうごかない。

plugins: [dataLabelSumPlugin],

コード

// 積み上げグラフに合計値を表示
var dataLabelSumPlugin = {
	afterDatasetsDraw: function (chart, easing) {
		var ctx = chart.ctx;
		var sums = [];

		chart.data.datasets.forEach(function (dataset, i) {
			var meta = chart.getDatasetMeta(i);
			if (!meta.hidden) {
				meta.data.forEach(function (element, index) {
					// 積み上げ総計の初期化
					if(i === 0){
						sums[index] = 0;
					}

					// 総計ラベルの設定
					ctx.fillStyle = 'rgb(0, 0, 0)';
					var fontSize = 16;
					var fontStyle = 'normal';
					var fontFamily = 'Helvetica Neue';
					ctx.font = Chart.helpers.fontString(fontSize, fontStyle, fontFamily);
					ctx.textAlign = 'center';
					ctx.textBaseline = 'middle';

					var padding = 5;
					var position = element.tooltipPosition();

					// 総計出力
					sums[index] = sums[index] + dataset.data[index];
					if(i === (chart.data.datasets.length -1)){
						ctx.fillText(sums[index].toString(), position.x, position.y - (fontSize / 2) - padding);
					}

				});
			}
		});
	}
};