From ea703a54bfd63ca0b0fda9adf4aa118b299a37d8 Mon Sep 17 00:00:00 2001 From: andig Date: Sun, 10 Sep 2017 19:15:47 +0200 Subject: [PATCH] Implement scale label padding (#4646) --- docs/axes/labelling.md | 1 + src/core/core.scale.js | 47 ++++++++++++------ .../core.scale/label-offset-vertical-axes.png | Bin 4434 -> 4435 bytes test/specs/core.helpers.tests.js | 12 +---- test/specs/core.scale.tests.js | 19 +++++++ test/specs/core.tooltip.tests.js | 8 +-- test/specs/scale.category.tests.js | 18 +++---- test/specs/scale.linear.tests.js | 22 ++++---- test/specs/scale.logarithmic.tests.js | 12 ++--- test/specs/scale.radialLinear.tests.js | 6 +-- test/specs/scale.time.tests.js | 6 +-- 11 files changed, 81 insertions(+), 70 deletions(-) diff --git a/docs/axes/labelling.md b/docs/axes/labelling.md index 22fc26004..aec8d990f 100644 --- a/docs/axes/labelling.md +++ b/docs/axes/labelling.md @@ -15,6 +15,7 @@ The scale label configuration is nested under the scale configuration in the `sc | `fontFamily` | `String` | `"'Helvetica Neue', 'Helvetica', 'Arial', sans-serif"` | Font family for the scale title, follows CSS font-family options. | `fontSize` | `Number` | `12` | Font size for scale title. | `fontStyle` | `String` | `'normal'` | Font style for the scale title, follows CSS font-style options (i.e. normal, italic, oblique, initial, inherit). +| `padding` | `Number` or `Object` | `4` | Padding to apply around scale labels. Only `top` and `bottom` are implemented. ## Creating Custom Tick Formats diff --git a/src/core/core.scale.js b/src/core/core.scale.js index bc4d1ec9c..f48b67a5e 100644 --- a/src/core/core.scale.js +++ b/src/core/core.scale.js @@ -36,7 +36,14 @@ defaults._set('scale', { // actual label labelString: '', - lineHeight: 1.2 + // line height + lineHeight: 1.2, + + // top/bottom padding + padding: { + top: 4, + bottom: 4 + } }, // label settings @@ -391,7 +398,6 @@ module.exports = function(Chart) { var tickFont = parseFontOptions(tickOpts); var tickMarkLength = opts.gridLines.tickMarkLength; - var scaleLabelLineHeight = parseLineHeight(scaleLabelOpts); // Width if (isHorizontal) { @@ -410,10 +416,14 @@ module.exports = function(Chart) { // Are we showing a title for the scale? if (scaleLabelOpts.display && display) { + var scaleLabelLineHeight = parseLineHeight(scaleLabelOpts); + var scaleLabelPadding = helpers.options.toPadding(scaleLabelOpts.padding); + var deltaHeight = scaleLabelLineHeight + scaleLabelPadding.height; + if (isHorizontal) { - minSize.height += scaleLabelLineHeight; + minSize.height += deltaHeight; } else { - minSize.width += scaleLabelLineHeight; + minSize.width += deltaHeight; } } @@ -435,16 +445,17 @@ module.exports = function(Chart) { // TODO - improve this calculation var labelHeight = (sinRotation * largestTextWidth) + (tickFont.size * tallestLabelHeightInLines) - + (lineSpace * tallestLabelHeightInLines); + + (lineSpace * (tallestLabelHeightInLines - 1)) + + lineSpace; // padding minSize.height = Math.min(me.maxHeight, minSize.height + labelHeight + tickPadding); - me.ctx.font = tickFont.font; + me.ctx.font = tickFont.font; var firstLabelWidth = computeTextSize(me.ctx, labels[0], tickFont.font); var lastLabelWidth = computeTextSize(me.ctx, labels[labels.length - 1], tickFont.font); - // Ensure that our ticks are always inside the canvas. When rotated, ticks are right aligned which means that the right padding is dominated - // by the font height + // Ensure that our ticks are always inside the canvas. When rotated, ticks are right aligned + // which means that the right padding is dominated by the font height if (me.labelRotation !== 0) { me.paddingLeft = opts.position === 'bottom' ? (cosRotation * firstLabelWidth) + 3 : (cosRotation * lineSpace) + 3; // add 3 px to move away from canvas edges me.paddingRight = opts.position === 'bottom' ? (cosRotation * lineSpace) + 3 : (cosRotation * lastLabelWidth) + 3; @@ -453,15 +464,18 @@ module.exports = function(Chart) { me.paddingRight = lastLabelWidth / 2 + 3; } } else { - // A vertical axis is more constrained by the width. Labels are the dominant factor here, so get that length first - // Account for padding - + // A vertical axis is more constrained by the width. Labels are the + // dominant factor here, so get that length first and account for padding if (tickOpts.mirror) { largestTextWidth = 0; } else { - largestTextWidth += tickPadding; + // use lineSpace for consistency with horizontal axis + // tickPadding is not implemented for horizontal + largestTextWidth += tickPadding + lineSpace; } + minSize.width = Math.min(me.maxWidth, minSize.width + largestTextWidth); + me.paddingTop = tickFont.size / 2; me.paddingBottom = tickFont.size / 2; } @@ -663,6 +677,7 @@ module.exports = function(Chart) { var scaleLabelFontColor = helpers.valueOrDefault(scaleLabel.fontColor, globalDefaults.defaultFontColor); var scaleLabelFont = parseFontOptions(scaleLabel); + var scaleLabelPadding = helpers.options.toPadding(scaleLabel.padding); var labelRotationRadians = helpers.toRadians(me.labelRotation); var itemsToDraw = []; @@ -840,10 +855,14 @@ module.exports = function(Chart) { if (isHorizontal) { scaleLabelX = me.left + ((me.right - me.left) / 2); // midpoint of the width - scaleLabelY = options.position === 'bottom' ? me.bottom - halfLineHeight : me.top + halfLineHeight; + scaleLabelY = options.position === 'bottom' + ? me.bottom - halfLineHeight - scaleLabelPadding.bottom + : me.top + halfLineHeight + scaleLabelPadding.top; } else { var isLeft = options.position === 'left'; - scaleLabelX = isLeft ? me.left + halfLineHeight : me.right - halfLineHeight; + scaleLabelX = isLeft + ? me.left + halfLineHeight + scaleLabelPadding.top + : me.right - halfLineHeight - scaleLabelPadding.top; scaleLabelY = me.top + ((me.bottom - me.top) / 2); rotation = isLeft ? -0.5 * Math.PI : 0.5 * Math.PI; } diff --git a/test/fixtures/core.scale/label-offset-vertical-axes.png b/test/fixtures/core.scale/label-offset-vertical-axes.png index 2f6b18c8c23939f2b79177a937ba2458298f826b..05785b8bc597181170ffe7bae4e472f35f8a0620 100644 GIT binary patch literal 4435 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 diff --git a/test/specs/core.helpers.tests.js b/test/specs/core.helpers.tests.js index 1b5edb89e..dc865fb01 100644 --- a/test/specs/core.helpers.tests.js +++ b/test/specs/core.helpers.tests.js @@ -128,11 +128,7 @@ describe('Core helper tests', function() { }, position: 'right', offset: false, - scaleLabel: { - display: false, - labelString: '', - lineHeight: 1.2 - }, + scaleLabel: Chart.defaults.scale.scaleLabel, ticks: { beginAtZero: false, minRotation: 0, @@ -170,11 +166,7 @@ describe('Core helper tests', function() { }, position: 'left', offset: false, - scaleLabel: { - display: false, - labelString: '', - lineHeight: 1.2 - }, + scaleLabel: Chart.defaults.scale.scaleLabel, ticks: { beginAtZero: false, minRotation: 0, diff --git a/test/specs/core.scale.tests.js b/test/specs/core.scale.tests.js index 58e5a33fa..dc2da042a 100644 --- a/test/specs/core.scale.tests.js +++ b/test/specs/core.scale.tests.js @@ -1,3 +1,22 @@ describe('Core.scale', function() { describe('auto', jasmine.specsFromFixtures('core.scale')); + + it('should provide default scale label options', function() { + expect(Chart.defaults.scale.scaleLabel).toEqual({ + // display property + display: false, + + // actual label + labelString: '', + + // actual label + lineHeight: 1.2, + + // top/bottom padding + padding: { + top: 4, + bottom: 4 + } + }); + }); }); diff --git a/test/specs/core.tooltip.tests.js b/test/specs/core.tooltip.tests.js index b1896da33..73d943bd8 100755 --- a/test/specs/core.tooltip.tests.js +++ b/test/specs/core.tooltip.tests.js @@ -143,7 +143,7 @@ describe('Core.Tooltip', function() { }] })); - expect(tooltip._view.x).toBeCloseToPixel(263); + expect(tooltip._view.x).toBeCloseToPixel(266); expect(tooltip._view.y).toBeCloseToPixel(155); }); @@ -341,7 +341,7 @@ describe('Core.Tooltip', function() { }] })); - expect(tooltip._view.x).toBeCloseToPixel(263); + expect(tooltip._view.x).toBeCloseToPixel(266); expect(tooltip._view.y).toBeCloseToPixel(312); }); @@ -494,7 +494,7 @@ describe('Core.Tooltip', function() { }] })); - expect(tooltip._view.x).toBeCloseToPixel(211); + expect(tooltip._view.x).toBeCloseToPixel(214); expect(tooltip._view.y).toBeCloseToPixel(190); }); @@ -574,7 +574,7 @@ describe('Core.Tooltip', function() { }] })); - expect(tooltip._view.x).toBeCloseToPixel(263); + expect(tooltip._view.x).toBeCloseToPixel(266); expect(tooltip._view.y).toBeCloseToPixel(155); }); diff --git a/test/specs/scale.category.tests.js b/test/specs/scale.category.tests.js index 8d8d32cd4..1665235ae 100644 --- a/test/specs/scale.category.tests.js +++ b/test/specs/scale.category.tests.js @@ -30,11 +30,7 @@ describe('Category scale tests', function() { }, position: 'bottom', offset: false, - scaleLabel: { - display: false, - labelString: '', - lineHeight: 1.2 - }, + scaleLabel: Chart.defaults.scale.scaleLabel, ticks: { beginAtZero: false, minRotation: 0, @@ -215,7 +211,7 @@ describe('Category scale tests', function() { }); var xScale = chart.scales.xScale0; - expect(xScale.getPixelForValue(0, 0, 0)).toBeCloseToPixel(23); + expect(xScale.getPixelForValue(0, 0, 0)).toBeCloseToPixel(23 + 6); // plus lineHeight expect(xScale.getValueForPixel(23)).toBe(0); expect(xScale.getPixelForValue(0, 4, 0)).toBeCloseToPixel(487); @@ -224,7 +220,7 @@ describe('Category scale tests', function() { xScale.options.offset = true; chart.update(); - expect(xScale.getPixelForValue(0, 0, 0)).toBeCloseToPixel(69); + expect(xScale.getPixelForValue(0, 0, 0)).toBeCloseToPixel(69 + 6); // plus lineHeight expect(xScale.getValueForPixel(69)).toBe(0); expect(xScale.getPixelForValue(0, 4, 0)).toBeCloseToPixel(441); @@ -258,8 +254,8 @@ describe('Category scale tests', function() { }); var xScale = chart.scales.xScale0; - expect(xScale.getPixelForValue('tick_1', 0, 0)).toBeCloseToPixel(23); - expect(xScale.getPixelForValue('tick_1', 1, 0)).toBeCloseToPixel(139); + expect(xScale.getPixelForValue('tick_1', 0, 0)).toBeCloseToPixel(23 + 6); // plus lineHeight + expect(xScale.getPixelForValue('tick_1', 1, 0)).toBeCloseToPixel(143); }); it ('Should get the correct pixel for a value when horizontal and zoomed', function() { @@ -293,13 +289,13 @@ describe('Category scale tests', function() { }); var xScale = chart.scales.xScale0; - expect(xScale.getPixelForValue(0, 1, 0)).toBeCloseToPixel(23); + expect(xScale.getPixelForValue(0, 1, 0)).toBeCloseToPixel(23 + 6); // plus lineHeight expect(xScale.getPixelForValue(0, 3, 0)).toBeCloseToPixel(496); xScale.options.offset = true; chart.update(); - expect(xScale.getPixelForValue(0, 1, 0)).toBeCloseToPixel(102); + expect(xScale.getPixelForValue(0, 1, 0)).toBeCloseToPixel(102 + 6); // plus lineHeight expect(xScale.getPixelForValue(0, 3, 0)).toBeCloseToPixel(417); }); diff --git a/test/specs/scale.linear.tests.js b/test/specs/scale.linear.tests.js index ed6f9c1f9..60dd07698 100644 --- a/test/specs/scale.linear.tests.js +++ b/test/specs/scale.linear.tests.js @@ -28,11 +28,7 @@ describe('Linear Scale', function() { }, position: 'left', offset: false, - scaleLabel: { - display: false, - labelString: '', - lineHeight: 1.2 - }, + scaleLabel: Chart.defaults.scale.scaleLabel, ticks: { beginAtZero: false, minRotation: 0, @@ -695,8 +691,8 @@ describe('Linear Scale', function() { var xScale = chart.scales.xScale0; expect(xScale.getPixelForValue(1, 0, 0)).toBeCloseToPixel(501); // right - paddingRight - expect(xScale.getPixelForValue(-1, 0, 0)).toBeCloseToPixel(31); // left + paddingLeft - expect(xScale.getPixelForValue(0, 0, 0)).toBeCloseToPixel(266); // halfway*/ + expect(xScale.getPixelForValue(-1, 0, 0)).toBeCloseToPixel(31 + 6); // left + paddingLeft + lineSpace + expect(xScale.getPixelForValue(0, 0, 0)).toBeCloseToPixel(266 + 6 / 2); // halfway*/ expect(xScale.getValueForPixel(501)).toBeCloseTo(1, 1e-2); expect(xScale.getValueForPixel(31)).toBeCloseTo(-1, 1e-2); @@ -754,7 +750,7 @@ describe('Linear Scale', function() { expect(xScale.paddingBottom).toBeCloseToPixel(0); expect(xScale.paddingLeft).toBeCloseToPixel(0); expect(xScale.paddingRight).toBeCloseToPixel(0); - expect(xScale.width).toBeCloseToPixel(468); + expect(xScale.width).toBeCloseToPixel(468 - 6); // minus lineSpace expect(xScale.height).toBeCloseToPixel(28); var yScale = chart.scales.yScale0; @@ -762,7 +758,7 @@ describe('Linear Scale', function() { expect(yScale.paddingBottom).toBeCloseToPixel(0); expect(yScale.paddingLeft).toBeCloseToPixel(0); expect(yScale.paddingRight).toBeCloseToPixel(0); - expect(yScale.width).toBeCloseToPixel(30); + expect(yScale.width).toBeCloseToPixel(30 + 6); // plus lineSpace expect(yScale.height).toBeCloseToPixel(452); // Extra size when scale label showing @@ -774,15 +770,15 @@ describe('Linear Scale', function() { expect(xScale.paddingBottom).toBeCloseToPixel(0); expect(xScale.paddingLeft).toBeCloseToPixel(0); expect(xScale.paddingRight).toBeCloseToPixel(0); - expect(xScale.width).toBeCloseToPixel(454); - expect(xScale.height).toBeCloseToPixel(42); + expect(xScale.width).toBeCloseToPixel(440); + expect(xScale.height).toBeCloseToPixel(50); expect(yScale.paddingTop).toBeCloseToPixel(0); expect(yScale.paddingBottom).toBeCloseToPixel(0); expect(yScale.paddingLeft).toBeCloseToPixel(0); expect(yScale.paddingRight).toBeCloseToPixel(0); - expect(yScale.width).toBeCloseToPixel(44); - expect(yScale.height).toBeCloseToPixel(438); + expect(yScale.width).toBeCloseToPixel(58); + expect(yScale.height).toBeCloseToPixel(430); }); it('should fit correctly when display is turned off', function() { diff --git a/test/specs/scale.logarithmic.tests.js b/test/specs/scale.logarithmic.tests.js index 98d0fbf09..9640b1d3d 100644 --- a/test/specs/scale.logarithmic.tests.js +++ b/test/specs/scale.logarithmic.tests.js @@ -27,11 +27,7 @@ describe('Logarithmic Scale tests', function() { }, position: 'left', offset: false, - scaleLabel: { - display: false, - labelString: '', - lineHeight: 1.2 - }, + scaleLabel: Chart.defaults.scale.scaleLabel, ticks: { beginAtZero: false, minRotation: 0, @@ -720,9 +716,9 @@ describe('Logarithmic Scale tests', function() { var xScale = chart.scales.xScale; expect(xScale.getPixelForValue(80, 0, 0)).toBeCloseToPixel(495); // right - paddingRight - expect(xScale.getPixelForValue(1, 0, 0)).toBeCloseToPixel(37); // left + paddingLeft - expect(xScale.getPixelForValue(10, 0, 0)).toBeCloseToPixel(278); // halfway - expect(xScale.getPixelForValue(0, 0, 0)).toBeCloseToPixel(37); // 0 is invalid, put it on the left. + expect(xScale.getPixelForValue(1, 0, 0)).toBeCloseToPixel(37 + 6); // left + paddingLeft + lineSpace + expect(xScale.getPixelForValue(10, 0, 0)).toBeCloseToPixel(278 + 6 / 2); // halfway + expect(xScale.getPixelForValue(0, 0, 0)).toBeCloseToPixel(37 + 6); // 0 is invalid, put it on the left. expect(xScale.getValueForPixel(495)).toBeCloseToPixel(80); expect(xScale.getValueForPixel(48)).toBeCloseTo(1, 1e-4); diff --git a/test/specs/scale.radialLinear.tests.js b/test/specs/scale.radialLinear.tests.js index 70c75f02a..707ce0b7c 100644 --- a/test/specs/scale.radialLinear.tests.js +++ b/test/specs/scale.radialLinear.tests.js @@ -40,11 +40,7 @@ describe('Test the radial linear scale', function() { }, position: 'chartArea', offset: false, - scaleLabel: { - display: false, - labelString: '', - lineHeight: 1.2 - }, + scaleLabel: Chart.defaults.scale.scaleLabel, ticks: { backdropColor: 'rgba(255,255,255,0.75)', backdropPaddingY: 2, diff --git a/test/specs/scale.time.tests.js b/test/specs/scale.time.tests.js index ac79368ec..98dd774b6 100755 --- a/test/specs/scale.time.tests.js +++ b/test/specs/scale.time.tests.js @@ -73,11 +73,7 @@ describe('Time scale tests', function() { }, position: 'bottom', offset: false, - scaleLabel: { - display: false, - labelString: '', - lineHeight: 1.2 - }, + scaleLabel: Chart.defaults.scale.scaleLabel, bounds: 'data', distribution: 'linear', ticks: { -- 2.47.2