Merge pull request #1788 from nnnick/fix/extended-bars

Better extensions of bar controllers

docs/07-Advanced.md

@@ -360,6 +360,9 @@ The built in controller types are:
 * `Chart.controllers.polarArea`
 * `Chart.controllers.bubble`
 
+#### Bar Controller
+The bar controller has a special property that you should be aware of. To correctly calculate the width of a bar, the controller must determine the number of datasets that map to bars. To do this, the bar controller attaches a property `bar` to the dataset during initialization. If you are creating a replacement or updated bar controller, you should do the same. This will ensure that charts with regular bars and your new derived bars will work seamlessly.
+
 ### Building Chart.js
 
 Chart.js uses <a href="http://gulpjs.com/" target="_blank">gulp</a> to build the library into a single JavaScript file. 

src/controllers/controller.bar.js

@@ -31,16 +31,18 @@
 	};
 
 	Chart.controllers.bar = Chart.DatasetController.extend({
+		initialize: function(chart, datasetIndex) {
+			Chart.DatasetController.prototype.initialize.call(this, chart, datasetIndex);
+
+			// Use this to indicate that this is a bar dataset. 
+			this.getDataset().bar = true;
+		},
 		// Get the number of datasets that display bars. We use this to correctly calculate the bar width
 		getBarCount: function getBarCount() {
 			var barCount = 0;
 			helpers.each(this.chart.data.datasets, function(dataset) {
-				if (helpers.isDatasetVisible(dataset)) {
-					if (dataset.type === 'bar') {
-						++barCount;
-					} else if (dataset.type === undefined && this.chart.config.type === 'bar') {
-						++barCount;
-					}
+				if (helpers.isDatasetVisible(dataset) && dataset.bar) {
+					++barCount;
 				}
 			}, this);
 			return barCount;
@@ -215,8 +217,7 @@
 			var barIndex = 0;
 
 			for (var j = 0; j < datasetIndex; ++j) {
-				if (helpers.isDatasetVisible(this.chart.data.datasets[j]) &&
-					(this.chart.data.datasets[j].type === 'bar' || (this.chart.data.datasets[j].type === undefined && this.chart.config.type === 'bar'))) {
+				if (helpers.isDatasetVisible(this.chart.data.datasets[j]) && this.chart.data.datasets[j].bar) {
 					++barIndex;
 				}
 			}

test/controller.bar.tests.js

@@ -52,11 +52,10 @@ describe('Bar controller tests', function() {
 		var chart = {
 			data: {
 				datasets: [{
-					type: 'line'
 				}, {
-					type: 'bar'
+					bar: true
 				}, {
-					// no type, defaults to bar
+					bar: true
 				}]
 			},
 			config: {
@@ -82,13 +81,13 @@ describe('Bar controller tests', function() {
 		var chart = {
 			data: {
 				datasets: [{
-					
+					bar: true,
 				}, {
+					bar: true,
 					hidden: true
 				}, {
-					type: 'line'
 				}, {
-					
+					bar: true,
 				}]
 			},
 			config: {
@@ -148,7 +147,8 @@ describe('Bar controller tests', function() {
 				data: [1, 2],
 				label: 'dataset1',
 				xAxisID: 'firstXScaleID',
-				yAxisID: 'firstYScaleID'
+				yAxisID: 'firstYScaleID',
+				bar: true
 			}, {
 				data: [10, 15, 0, -4],
 				label: 'dataset2'