fix stacked bars on logarithmic axes

chartjs · Dec 10, 2016 · abba3db · abba3db
1 parent 6f40d04
commit abba3db
Show file tree

Hide file tree

Showing 3 changed files with 75 additions and 11 deletions.
diff --git a/src/controllers/controller.bar.js b/src/controllers/controller.bar.js
@@ -99,7 +99,8 @@ module.exports = function(Chart) {
 			var me = this;
 			var meta = me.getMeta();
 			var yScale = me.getScaleForId(meta.yAxisID);
-			var base = 0;
+			var base = yScale.getBaseValue();
+			var original = base;
 
 			if (yScale.options.stacked) {
 				var chart = me.chart;
@@ -111,7 +112,7 @@ module.exports = function(Chart) {
 					var currentDsMeta = chart.getDatasetMeta(i);
 					if (currentDsMeta.bar && currentDsMeta.yAxisID === yScale.id && chart.isDatasetVisible(i)) {
 						var currentVal = Number(currentDs.data[index]);
-						base += value < 0 ? Math.min(currentVal, 0) : Math.max(currentVal, 0);
+						base += value < 0 ? Math.min(currentVal, original) : Math.max(currentVal, original);
 					}
 				}
 
@@ -197,8 +198,9 @@ module.exports = function(Chart) {
 
 			if (yScale.options.stacked) {
 
-				var sumPos = 0,
-					sumNeg = 0;
+				var base = yScale.getBaseValue();
+				var sumPos = base,
+					sumNeg = base;
 
 				for (var i = 0; i < datasetIndex; i++) {
 					var ds = me.chart.data.datasets[i];
@@ -417,7 +419,8 @@ module.exports = function(Chart) {
 			var me = this;
 			var meta = me.getMeta();
 			var xScale = me.getScaleForId(meta.xAxisID);
-			var base = 0;
+			var base = xScale.getBaseValue();
+			var originalBase = base;
 
 			if (xScale.options.stacked) {
 				var chart = me.chart;
@@ -429,7 +432,7 @@ module.exports = function(Chart) {
 					var currentDsMeta = chart.getDatasetMeta(i);
 					if (currentDsMeta.bar && currentDsMeta.xAxisID === xScale.id && chart.isDatasetVisible(i)) {
 						var currentVal = Number(currentDs.data[index]);
-						base += value < 0 ? Math.min(currentVal, 0) : Math.max(currentVal, 0);
+						base += value < 0 ? Math.min(currentVal, originalBase) : Math.max(currentVal, originalBase);
 					}
 				}
 
@@ -481,8 +484,9 @@ module.exports = function(Chart) {
 
 			if (xScale.options.stacked) {
 
-				var sumPos = 0,
-					sumNeg = 0;
+				var base = xScale.getBaseValue();
+				var sumPos = base,
+					sumNeg = base;
 
 				for (var i = 0; i < datasetIndex; i++) {
 					var ds = me.chart.data.datasets[i];

diff --git a/src/core/core.scale.js b/src/core/core.scale.js
@@ -454,15 +454,18 @@ module.exports = function(Chart) {
 		},
 
 		getBasePixel: function() {
+			return this.getPixelForValue(this.getBaseValue());
+		},
+
+		getBaseValue: function() {
 			var me = this;
 			var min = me.min;
 			var max = me.max;
 
-			return me.getPixelForValue(
-				me.beginAtZero? 0:
+			return me.beginAtZero ? 0:
 				min < 0 && max < 0? max :
 				min > 0 && max > 0? min :
-				0);
+				0;
 		},
 
 		// Actually draw the scale on the canvas

diff --git a/test/controller.bar.tests.js b/test/controller.bar.tests.js
@@ -337,6 +337,63 @@ describe('Bar controller tests', function() {
 		});
 	});
 
+	it('should update elements when the scales are stacked and the y axis is logarithmic', function() {
+		var chart = window.acquireChart({
+			type: 'bar',
+			data: {
+				datasets: [{
+					data: [10, 100, 10, 100],
+					label: 'dataset1'
+				}, {
+					data: [100, 10, 0, 100],
+					label: 'dataset2'
+				}],
+				labels: ['label1', 'label2', 'label3', 'label4']
+			},
+			options: {
+				scales: {
+					xAxes: [{
+						type: 'category',
+						stacked: true,
+						barPercentage: 1
+					}],
+					yAxes: [{
+						type: 'logarithmic',
+						stacked: true
+					}]
+				}
+			}
+		});
+
+		var meta0 = chart.getDatasetMeta(0);
+
+		[
+			{b: 484, w: 92, x: 94, y: 379},
+			{b: 484, w: 92, x: 208, y: 122},
+			{b: 484, w: 92, x: 322, y: 379},
+			{b: 484, w: 92, x: 436, y: 122}
+		].forEach(function(values, i) {
+			expect(meta0.data[i]._model.base).toBeCloseToPixel(values.b);
+			expect(meta0.data[i]._model.width).toBeCloseToPixel(values.w);
+			expect(meta0.data[i]._model.x).toBeCloseToPixel(values.x);
+			expect(meta0.data[i]._model.y).toBeCloseToPixel(values.y);
+		});
+
+		var meta1 = chart.getDatasetMeta(1);
+
+		[
+			{b: 379, w: 92, x: 94, y: 109},
+			{b: 122, w: 92, x: 208, y: 109},
+			{b: 379, w: 92, x: 322, y: 379},
+			{b: 122, w: 92, x: 436, y: 25}
+		].forEach(function(values, i) {
+			expect(meta1.data[i]._model.base).toBeCloseToPixel(values.b);
+			expect(meta1.data[i]._model.width).toBeCloseToPixel(values.w);
+			expect(meta1.data[i]._model.x).toBeCloseToPixel(values.x);
+			expect(meta1.data[i]._model.y).toBeCloseToPixel(values.y);
+		});
+	});
+
 	it('should draw all bars', function() {
 		var chart = window.acquireChart({
 			type: 'bar',