mirror of
https://github.com/chartjs/Chart.js.git
synced 2024-10-06 04:09:08 +02:00
Line height setting for scale titles. The text is centered within the line height, so setting the line height to a size
greater than the font size moves it away from the axis edge.
This commit is contained in:
parent
961911065f
commit
18707cf81f
@ -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.
|
||||
|
@ -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;
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user