From: Evert Timberg Date: Fri, 13 Nov 2015 18:24:22 +0000 (-0500) Subject: Always include padding to ensure that we can always see the tick labels of vertical... X-Git-Tag: 2.0.0-beta1~26^2 X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=refs%2Fpull%2F1649%2Fhead;p=thirdparty%2FChart.js.git Always include padding to ensure that we can always see the tick labels of vertical axes --- diff --git a/src/core/core.scale.js b/src/core/core.scale.js index edf807de0..b4182d21d 100644 --- a/src/core/core.scale.js +++ b/src/core/core.scale.js @@ -259,6 +259,8 @@ // A horizontal axis is more constrained by the height. var maxLabelHeight = this.maxHeight - this.minSize.height; var longestLabelWidth = helpers.longestText(this.ctx, labelFont, this.ticks); + + // TODO - improve this calculation var labelHeight = (Math.sin(helpers.toRadians(this.labelRotation)) * longestLabelWidth) + 1.5 * this.options.ticks.fontSize; this.minSize.height = Math.min(this.maxHeight, this.minSize.height + labelHeight); @@ -280,6 +282,11 @@ var maxLabelWidth = this.maxWidth - this.minSize.width; var largestTextWidth = helpers.longestText(this.ctx, labelFont, this.ticks); + // Account for padding + if (!this.options.ticks.mirror) { + largestTextWidth += this.options.ticks.padding; + } + if (largestTextWidth < maxLabelWidth) { // We don't need all the room this.minSize.width += largestTextWidth; diff --git a/test/controller.bar.tests.js b/test/controller.bar.tests.js index fc6308f56..d271cf621 100644 --- a/test/controller.bar.tests.js +++ b/test/controller.bar.tests.js @@ -262,7 +262,7 @@ describe('Bar controller tests', function() { expect(bar1._xScale).toBe(chart.scales.firstXScaleID); expect(bar1._yScale).toBe(chart.scales.firstYScaleID); expect(bar1._model).toEqual({ - x: 103.60000000000001, + x: 113.60000000000001, y: 194, label: 'label1', datasetLabel: 'dataset2', @@ -279,7 +279,7 @@ describe('Bar controller tests', function() { expect(bar2._xScale).toBe(chart.scales.firstXScaleID); expect(bar2._yScale).toBe(chart.scales.firstYScaleID); expect(bar2._model).toEqual({ - x: 141.6, + x: 151.60000000000002, y: 6, label: 'label2', datasetLabel: 'dataset2', diff --git a/test/controller.line.tests.js b/test/controller.line.tests.js index 7e86c99bd..cdfb9bdc9 100644 --- a/test/controller.line.tests.js +++ b/test/controller.line.tests.js @@ -267,13 +267,13 @@ describe('Line controller tests', function() { tension: 0.1, // Point - x: 71, + x: 81, y: 62, // Control points - controlPointPreviousX: 71, + controlPointPreviousX: 81, controlPointPreviousY: 62, - controlPointNextX: 76, + controlPointNextX: 86, controlPointNextY: 57.3, }); @@ -287,13 +287,13 @@ describe('Line controller tests', function() { tension: 0.1, // Point - x: 121, + x: 131, y: 15, // Control points - controlPointPreviousX: 117.82889384189087, + controlPointPreviousX: 127.82889384189087, controlPointPreviousY: 12.04867347661131, - controlPointNextX: 127.92889384189088, + controlPointNextX: 137.92889384189088, controlPointNextY: 21.44867347661131, }); @@ -307,13 +307,13 @@ describe('Line controller tests', function() { tension: 0.1, // Point - x: 172, + x: 182, y: 156, // Control points - controlPointPreviousX: 164.8815225337256, + controlPointPreviousX: 174.8815225337256, controlPointPreviousY: 143.38408449046415, - controlPointNextX: 174.98152253372558, + controlPointNextX: 184.98152253372558, controlPointNextY: 161.28408449046415, }); @@ -327,13 +327,13 @@ describe('Line controller tests', function() { tension: 0.1, // Point - x: 222, + x: 232, y: 194, // Control points - controlPointPreviousX: 217, + controlPointPreviousX: 227, controlPointPreviousY: 190.2, - controlPointNextX: 222, + controlPointNextX: 232, controlPointNextY: 194, }); @@ -383,13 +383,13 @@ describe('Line controller tests', function() { tension: 0.2, // Point - x: 71, + x: 81, y: 62, // Control points - controlPointPreviousX: 71, + controlPointPreviousX: 81, controlPointPreviousY: 62, - controlPointNextX: 81, + controlPointNextX: 91, controlPointNextY: 52.6, }); @@ -403,13 +403,13 @@ describe('Line controller tests', function() { tension: 0.2, // Point - x: 121, + x: 131, y: 15, // Control points - controlPointPreviousX: 114.65778768378175, + controlPointPreviousX: 124.65778768378175, controlPointPreviousY: 9.097346953222619, - controlPointNextX: 134.85778768378177, + controlPointNextX: 144.85778768378177, controlPointNextY: 27.897346953222623, }); @@ -423,13 +423,13 @@ describe('Line controller tests', function() { tension: 0.2, // Point - x: 172, + x: 182, y: 156, // Control points - controlPointPreviousX: 157.76304506745115, + controlPointPreviousX: 167.76304506745115, controlPointPreviousY: 130.76816898092827, - controlPointNextX: 177.96304506745116, + controlPointNextX: 187.96304506745116, controlPointNextY: 166.56816898092828, }); @@ -443,13 +443,13 @@ describe('Line controller tests', function() { tension: 0.2, // Point - x: 222, + x: 232, y: 194, // Control points - controlPointPreviousX: 212, + controlPointPreviousX: 222, controlPointPreviousY: 186.4, - controlPointNextX: 222, + controlPointNextX: 232, controlPointNextY: 194, }); @@ -505,13 +505,13 @@ describe('Line controller tests', function() { tension: 0.15, // Point - x: 71, + x: 81, y: 62, // Control points - controlPointPreviousX: 71, + controlPointPreviousX: 81, controlPointPreviousY: 62, - controlPointNextX: 78.5, + controlPointNextX: 88.5, controlPointNextY: 54.95, }); }); diff --git a/test/core.scaleService.tests.js b/test/core.scaleService.tests.js index 3ea3e8a5b..e69cc1eab 100644 --- a/test/core.scaleService.tests.js +++ b/test/core.scaleService.tests.js @@ -42,24 +42,24 @@ describe('Test the scale service', function() { Chart.scaleService.update(chartInstance, canvasWidth, canvasHeight); expect(chartInstance.chartArea).toEqual({ - left: 45, + left: 55, right: 245, top: 5, - bottom: 76.0423977855504, + bottom: 75.0664716027288, }); // Is xScale at the right spot - expect(xScale.left).toBe(45); + expect(xScale.left).toBe(55); expect(xScale.right).toBe(245); - expect(xScale.top).toBe(76.0423977855504); + expect(xScale.top).toBe(75.0664716027288); expect(xScale.bottom).toBe(145); - expect(xScale.labelRotation).toBe(55); + expect(xScale.labelRotation).toBe(57); // Is yScale at the right spot expect(yScale.left).toBe(5); - expect(yScale.right).toBe(45); + expect(yScale.right).toBe(55); expect(yScale.top).toBe(5); - expect(yScale.bottom).toBe(76.0423977855504); + expect(yScale.bottom).toBe(75.0664716027288); }); it('should fit scales that are in the top and right positions', function() { @@ -107,22 +107,22 @@ describe('Test the scale service', function() { expect(chartInstance.chartArea).toEqual({ left: 5, - right: 205, - top: 73.9576022144496, + right: 195, + top: 74.9335283972712, bottom: 145, }); // Is xScale at the right spot expect(xScale.left).toBe(5); - expect(xScale.right).toBe(205); + expect(xScale.right).toBe(195); expect(xScale.top).toBe(5); - expect(xScale.bottom).toBe(73.9576022144496); - expect(xScale.labelRotation).toBe(55); + expect(xScale.bottom).toBe(74.9335283972712); + expect(xScale.labelRotation).toBe(57); // Is yScale at the right spot - expect(yScale.left).toBe(205); + expect(yScale.left).toBe(195); expect(yScale.right).toBe(245); - expect(yScale.top).toBe(73.9576022144496); + expect(yScale.top).toBe(74.9335283972712); expect(yScale.bottom).toBe(145); }); @@ -179,28 +179,28 @@ describe('Test the scale service', function() { Chart.scaleService.update(chartInstance, canvasWidth, canvasHeight); expect(chartInstance.chartArea).toEqual({ - left: 95, + left: 115, right: 245, top: 5, - bottom: 70.01536896070459, + bottom: 68.48521368620018, }); // Is xScale at the right spot - expect(xScale.left).toBe(95); + expect(xScale.left).toBe(115); expect(xScale.right).toBe(245); - expect(xScale.top).toBe(70.01536896070459); + expect(xScale.top).toBe(68.48521368620018); expect(xScale.bottom).toBe(145); // Are yScales at the right spot expect(yScale1.left).toBe(5); - expect(yScale1.right).toBe(45); + expect(yScale1.right).toBe(55); expect(yScale1.top).toBe(5); - expect(yScale1.bottom).toBe(70.01536896070459); + expect(yScale1.bottom).toBe(68.48521368620018); - expect(yScale2.left).toBe(45); - expect(yScale2.right).toBe(95); + expect(yScale2.left).toBe(55); + expect(yScale2.right).toBe(115); expect(yScale2.top).toBe(5); - expect(yScale2.bottom).toBe(70.01536896070459); + expect(yScale2.bottom).toBe(68.48521368620018); }); // This is an oddball case. What happens is, when the scales are fit the first time they must fit within the assigned size. In this case, diff --git a/test/scale.linear.tests.js b/test/scale.linear.tests.js index e83c77cdb..c4d6948e9 100644 --- a/test/scale.linear.tests.js +++ b/test/scale.linear.tests.js @@ -592,10 +592,10 @@ describe('Linear Scale', function() { var minSize = verticalScale.update(100, 300); expect(minSize).toEqual({ - width: 30, + width: 40, height: 300, }); - expect(verticalScale.width).toBe(30); + expect(verticalScale.width).toBe(40); expect(verticalScale.height).toBe(300); expect(verticalScale.paddingTop).toBe(6); expect(verticalScale.paddingBottom).toBe(6); @@ -622,7 +622,7 @@ describe('Linear Scale', function() { config.scaleLabel.show = true; minSize = verticalScale.update(100, 300); expect(minSize).toEqual({ - width: 48, + width: 58, height: 300, }); });