From 5dd1c77cf51adda1055c2eabb9f064b8ed5ee5ff Mon Sep 17 00:00:00 2001 From: Evert Timberg Date: Mon, 24 Oct 2016 22:36:50 -0400 Subject: [PATCH] Take vertical padding into account --- src/core/core.layoutService.js | 22 +++++++++++++++++----- src/core/core.scale.js | 6 ++++++ test/scale.logarithmic.tests.js | 2 +- 3 files changed, 24 insertions(+), 6 deletions(-) diff --git a/src/core/core.layoutService.js b/src/core/core.layoutService.js index 2afdedfa3..39cf26b90 100644 --- a/src/core/core.layoutService.js +++ b/src/core/core.layoutService.js @@ -154,9 +154,11 @@ module.exports = function(Chart) { helpers.each(leftBoxes.concat(rightBoxes, topBoxes, bottomBoxes), getMinimumBoxSize); - // If a box has padding, we move the left scale over to avoid ugly charts (see issue #2478) + // If a horizontal box has padding, we move the left boxes over to avoid ugly charts (see issue #2478) var maxHorizontalLeftPadding = 0; var maxHorizontalRightPadding = 0; + var maxVerticalTopPadding = 0; + var maxVerticalBottomPadding = 0; helpers.each(topBoxes.concat(bottomBoxes), function(horizontalBox) { if (horizontalBox.getPadding) { @@ -166,6 +168,14 @@ module.exports = function(Chart) { } }); + helpers.each(leftBoxes.concat(rightBoxes), function(verticalBox) { + if (verticalBox.getPadding) { + var boxPadding = verticalBox.getPadding(); + maxVerticalTopPadding = Math.max(maxVerticalTopPadding, boxPadding.top); + maxVerticalBottomPadding = Math.max(maxVerticalBottomPadding, boxPadding.bottom); + } + }); + // At this point, maxChartAreaHeight and maxChartAreaWidth are the size the chart area could // be if the axes are drawn at their minimum sizes. // Steps 5 & 6 @@ -264,10 +274,12 @@ module.exports = function(Chart) { // We may be adding some padding to account for rotated x axis labels var leftPaddingAddition = Math.max(maxHorizontalLeftPadding - totalLeftBoxesWidth, 0); - var rightPaddingAddition = Math.max(maxHorizontalRightPadding - totalRightBoxesWidth, 0); - totalLeftBoxesWidth += leftPaddingAddition; - totalRightBoxesWidth += rightPaddingAddition; + totalRightBoxesWidth += Math.max(maxHorizontalRightPadding - totalRightBoxesWidth, 0); + + var topPaddingAddition = Math.max(maxVerticalTopPadding - totalTopBoxesHeight, 0); + totalTopBoxesHeight += topPaddingAddition; + totalBottomBoxesHeight += Math.max(maxVerticalBottomPadding - totalBottomBoxesHeight, 0); // Figure out if our chart area changed. This would occur if the dataset layout label rotation // changed due to the application of the margins in step 6. Since we can only get bigger, this is safe to do @@ -302,7 +314,7 @@ module.exports = function(Chart) { // Step 7 - Position the boxes var left = leftPadding + leftPaddingAddition; - var top = topPadding; + var top = topPadding + topPaddingAddition; function placeBox(box) { if (box.isHorizontal()) { diff --git a/src/core/core.scale.js b/src/core/core.scale.js index 1f6363c07..32ece041f 100644 --- a/src/core/core.scale.js +++ b/src/core/core.scale.js @@ -51,6 +51,12 @@ module.exports = function(Chart) { }; Chart.Scale = Chart.Element.extend({ + /** + * Get the padding needed for the scale + * @method getPadding + * @private + * @returns {Padding} the necessary padding + */ getPadding: function() { var me = this; return { diff --git a/test/scale.logarithmic.tests.js b/test/scale.logarithmic.tests.js index 4ca9ab62e..14a382e5f 100644 --- a/test/scale.logarithmic.tests.js +++ b/test/scale.logarithmic.tests.js @@ -722,7 +722,7 @@ describe('Logarithmic Scale tests', function() { expect(xScale.getPixelForValue(10, 0, 0)).toBeCloseToPixel(276); // halfway expect(xScale.getPixelForValue(0, 0, 0)).toBeCloseToPixel(48); // 0 is invalid, put it on the left. - expect(xScale.getValueForPixel(481.5)).toBeCloseTo(80, 1e-4); + expect(xScale.getValueForPixel(481.5)).toBeCloseToPixel(80); expect(xScale.getValueForPixel(48)).toBeCloseTo(1, 1e-4); expect(xScale.getValueForPixel(276)).toBeCloseTo(10, 1e-4); -- 2.47.3