]> git.ipfire.org Git - thirdparty/Chart.js.git/commitdiff
Line height setting for scale titles. The text is centered within the line height...
authoretimberg <evert.timberg@gmail.com>
Mon, 19 Jun 2017 01:21:37 +0000 (21:21 -0400)
committerEvert Timberg <evert.timberg+github@gmail.com>
Fri, 23 Jun 2017 22:09:30 +0000 (18:09 -0400)
greater than the font size moves it away from the axis edge.

docs/axes/labelling.md
src/core/core.scale.js

index ef43cdb01cf7d654476a364ea8b09b3a2530a0ea..5e4a6a76b87a607fdea431f6db7c068d944ae291 100644 (file)
@@ -10,6 +10,7 @@ The scale label configuration is nested under the scale configuration in the `sc
 | -----| ---- | --------| -----------
 | `display` | `Boolean` | `false` | If true, display the axis title.
 | `labelString` | `String` | `''` | The text for the title. (i.e. "# of People" or "Response Choices").
+| `lineHeight` | `Number` | `` | Height of an individual line of text. If not defined, the font size is used.
 | `fontColor` | Color | `'#666'` | Font color for scale title.
 | `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.
index 471540e034c1a3d077b9615cb8e6920dfe9172b0..be69ed9089fa4d11530ee36e9b7175affd57bd7f 100644 (file)
@@ -32,7 +32,7 @@ module.exports = function(Chart) {
                        labelString: '',
 
                        // display property
-                       display: false
+                       display: false,
                },
 
                // label settings
@@ -308,7 +308,7 @@ module.exports = function(Chart) {
                        var isHorizontal = me.isHorizontal();
 
                        var tickFont = parseFontOptions(tickOpts);
-                       var scaleLabelFontSize = parseFontOptions(scaleLabelOpts).size * 1.5;
+                       var scaleLabelLineHeight = helpers.getValueOrDefault(scaleLabelOpts.lineHeight, parseFontOptions(scaleLabelOpts).size * 1.5);
                        var tickMarkLength = opts.gridLines.tickMarkLength;
 
                        // Width
@@ -329,9 +329,9 @@ module.exports = function(Chart) {
                        // Are we showing a title for the scale?
                        if (scaleLabelOpts.display && display) {
                                if (isHorizontal) {
-                                       minSize.height += scaleLabelFontSize;
+                                       minSize.height += scaleLabelLineHeight;
                                } else {
-                                       minSize.width += scaleLabelFontSize;
+                                       minSize.width += scaleLabelLineHeight;
                                }
                        }
 
@@ -734,13 +734,14 @@ module.exports = function(Chart) {
                                var scaleLabelX;
                                var scaleLabelY;
                                var rotation = 0;
+                               var halfLineHeight = helpers.getValueOrDefault(scaleLabel.lineHeight, scaleLabelFont.size) / 2;
 
                                if (isHorizontal) {
                                        scaleLabelX = me.left + ((me.right - me.left) / 2); // midpoint of the width
-                                       scaleLabelY = options.position === 'bottom' ? me.bottom - (scaleLabelFont.size / 2) : me.top + (scaleLabelFont.size / 2);
+                                       scaleLabelY = options.position === 'bottom' ? me.bottom - halfLineHeight : me.top + halfLineHeight;
                                } else {
                                        var isLeft = options.position === 'left';
-                                       scaleLabelX = isLeft ? me.left + (scaleLabelFont.size / 2) : me.right - (scaleLabelFont.size / 2);
+                                       scaleLabelX = isLeft ? me.left + halfLineHeight : me.right - halfLineHeight;
                                        scaleLabelY = me.top + ((me.bottom - me.top) / 2);
                                        rotation = isLeft ? -0.5 * Math.PI : 0.5 * Math.PI;
                                }