Revert "Scriptable tick fonts (chartjs#6939)"

This reverts commit 738ee34.

docs/axes/styling.md

@@ -35,25 +35,44 @@ For function arguments, the function is passed a context object that is of the f
 ## Tick Configuration
 The tick configuration is nested under the scale configuration in the `ticks` key. It defines options for the tick marks that are generated by the axis.
 
-| Name | Type | [Scriptable](../general/options.md#scriptable-options) | Default | Description
+| Name | Type | Default | Description
+| ---- | ---- | ------- | -----------
+| `callback` | `function` | | Returns the string representation of the tick value as it should be displayed on the chart. See [callback](../axes/labelling.md#creating-custom-tick-formats).
+| `display` | `boolean` | `true` | If true, show tick labels.
+| `fontColor` | `Color` | `'#666'` | Font color for tick labels.
+| `fontFamily` | `string` | `"'Helvetica Neue', 'Helvetica', 'Arial', sans-serif"` | Font family for the tick labels, follows CSS font-family options.
+| `fontSize` | `number` | `12` | Font size for the tick labels.
+| `fontStyle` | `string` | `'normal'` | Font style for the tick labels, follows CSS font-style options (i.e. normal, italic, oblique, initial, inherit).
+| `lineHeight` | <code>number&#124;string</code> | `1.2` | Height of an individual line of text (see [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/line-height)).
+| `reverse` | `boolean` | `false` | Reverses order of tick labels.
+| `lineWidth` | `number` | `0` | Stroke width around the text.
+| `minor` | `object` | `{}` | Minor ticks configuration. Omitted options are inherited from options above.
+| `major` | `object` | `{}` | Major ticks configuration. Omitted options are inherited from options above.
+| `padding` | `number` | `0` | Sets the offset of the tick labels from the axis
+| `strokeStyle` | `string` | `` | The color of the stroke around the text.
+| `z` | `number` | `0` | z-index of tick layer. Useful when ticks are drawn on chart area. Values &lt;= 0 are drawn under datasets, &gt; 0 on top.
+
+## Minor Tick Configuration
+The minorTick configuration is nested under the ticks configuration in the `minor` key. It defines options for the minor tick marks that are generated by the axis. Omitted options are inherited from `ticks` configuration.
+
+| Name | Type | Default | Description
 | ---- | ---- | ------- | -----------
-| `callback` | `function` | | | Returns the string representation of the tick value as it should be displayed on the chart. See [callback](../axes/labelling.md#creating-custom-tick-formats).
-| `display` | `boolean` | | `true` | If true, show tick labels.
-| `fontColor` | `Color` | Yes | `'#666'` | Font color for tick labels.
-| `fontFamily` | `string` | Yes | `"'Helvetica Neue', 'Helvetica', 'Arial', sans-serif"` | Font family for the tick labels, follows CSS font-family options.
-| `fontSize` | `number` | Yes | `12` | Font size for the tick labels.
-| `fontStyle` | `string` | Yes | `'normal'` | Font style for the tick labels, follows CSS font-style options (i.e. normal, italic, oblique, initial, inherit).
-| `lineHeight` | <code>number&#124;string</code> | Yes | `1.2` | Height of an individual line of text (see [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/line-height)).
-| `lineWidth` | `number` | Yes | `0` | Stroke width around the text.
-| `major` | `object` | | `{}` | Major ticks configuration.
-| `padding` | `number` | | `0` | Sets the offset of the tick labels from the axis
-| `reverse` | `boolean` | | `false` | Reverses order of tick labels.
-| `strokeStyle` | `string` | Yes | `` | The color of the stroke around the text.
-| `z` | `number` | `0` | | z-index of tick layer. Useful when ticks are drawn on chart area. Values &lt;= 0 are drawn under datasets, &gt; 0 on top.
+| `callback` | `function` | | Returns the string representation of the tick value as it should be displayed on the chart. See [callback](../axes/labelling.md#creating-custom-tick-formats).
+| `fontColor` | `Color` | `'#666'` | Font color for tick labels.
+| `fontFamily` | `string` | `"'Helvetica Neue', 'Helvetica', 'Arial', sans-serif"` | Font family for the tick labels, follows CSS font-family options.
+| `fontSize` | `number` | `12` | Font size for the tick labels.
+| `fontStyle` | `string` | `'normal'` | Font style for the tick labels, follows CSS font-style options (i.e. normal, italic, oblique, initial, inherit).
+| `lineHeight` | <code>number&#124;string</code> | `1.2` | Height of an individual line of text (see [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/line-height)).
 
 ## Major Tick Configuration
-The majorTick configuration is nested under the ticks configuration in the `major` key. It defines options for the major tick marks that are generated by the axis.
+The majorTick configuration is nested under the ticks configuration in the `major` key. It defines options for the major tick marks that are generated by the axis. Omitted options are inherited from `ticks` configuration. These options are disabled by default.
 
 | Name | Type | Default | Description
 | ---- | ---- | ------- | -----------
-| `enabled` | `boolean` | `false` | If true, major ticks are generated. A major tick will affect autoskipping and `major` will be defined on ticks in the scriptable options context.
+| `enabled` | `boolean` | `false` | If true, major tick options are used to show major ticks.
+| `callback` | `function` | | Returns the string representation of the tick value as it should be displayed on the chart. See [callback](../axes/labelling.md#creating-custom-tick-formats).
+| `fontColor` | `Color` | `'#666'` | Font color for tick labels.
+| `fontFamily` | `string` | `"'Helvetica Neue', 'Helvetica', 'Arial', sans-serif"` | Font family for the tick labels, follows CSS font-family options.
+| `fontSize` | `number` | `12` | Font size for the tick labels.
+| `fontStyle` | `string` | `'normal'` | Font style for the tick labels, follows CSS font-style options (i.e. normal, italic, oblique, initial, inherit).
+| `lineHeight` | <code>number&#124;string</code> | `1.2` | Height of an individual line of text (see [MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/line-height)).

docs/getting-started/v3-migration.md

@@ -12,7 +12,6 @@ Chart.js 3.0 introduces a number of breaking changes. Chart.js 2.0 was released
 ### Ticks
 
 * `options.ticks.userCallback` was renamed to `options.ticks.callback`
-* `options.ticks.major` and `options.ticks.minor` were replaced with scriptable options for tick fonts.
 
 ### Tooltip
 

samples/scales/time/financial.html

@@ -122,9 +122,7 @@
 						ticks: {
 							major: {
 								enabled: true,
-							},
-							fontStyle: function(context) {
-								return context.tick.major ? 'bold' : undefined;
+								fontStyle: 'bold'
 							},
 							source: 'data',
 							autoSkip: true,

src/core/core.scale.js

@@ -135,6 +135,26 @@ function getScaleLabelHeight(options) {
 	return font.lineHeight + padding.height;
 }
 
+function parseFontOptions(options, nestedOpts) {
+	return helpers.extend(helpers.options._parseFont({
+		fontFamily: valueOrDefault(nestedOpts.fontFamily, options.fontFamily),
+		fontSize: valueOrDefault(nestedOpts.fontSize, options.fontSize),
+		fontStyle: valueOrDefault(nestedOpts.fontStyle, options.fontStyle),
+		lineHeight: valueOrDefault(nestedOpts.lineHeight, options.lineHeight)
+	}), {
+		color: resolve([nestedOpts.fontColor, options.fontColor, defaults.fontColor]),
+		lineWidth: valueOrDefault(nestedOpts.lineWidth, options.lineWidth),
+		strokeStyle: valueOrDefault(nestedOpts.strokeStyle, options.strokeStyle)
+	});
+}
+
+function parseTickFontOptions(options) {
+	const minor = parseFontOptions(options, options.minor);
+	const major = options.major.enabled ? parseFontOptions(options, options.major) : minor;
+
+	return {minor, major};
+}
+
 function getEvenSpacing(arr) {
 	const len = arr.length;
 	let i, diff;
@@ -605,12 +625,13 @@ class Scale extends Element {
 
 		// Don't bother fitting the ticks if we are not showing the labels
 		if (tickOpts.display && display) {
+			const tickFonts = parseTickFontOptions(tickOpts);
 			const labelSizes = me._getLabelSizes();
 			const firstLabelSize = labelSizes.first;
 			const lastLabelSize = labelSizes.last;
 			const widestLabelSize = labelSizes.widest;
 			const highestLabelSize = labelSizes.highest;
-			const lineSpace = highestLabelSize.offset * 0.8;
+			const lineSpace = tickFonts.minor.lineHeight * 0.4;
 			const tickPadding = tickOpts.padding;
 
 			if (isHorizontal) {
@@ -733,6 +754,7 @@ class Scale extends Element {
 	_computeLabelSizes() {
 		const me = this;
 		const ctx = me.ctx;
+		const tickFonts = parseTickFontOptions(me.options.ticks);
 		const caches = me._longestTextCache;
 		const sampleSize = me.options.ticks.sampleSize;
 		const widths = [];
@@ -747,7 +769,7 @@ class Scale extends Element {
 
 		for (i = 0; i < length; ++i) {
 			label = ticks[i].label;
-			tickFont = me._resolveTickFontOptions(i);
+			tickFont = ticks[i].major ? tickFonts.major : tickFonts.minor;
 			ctx.font = fontString = tickFont.string;
 			cache = caches[fontString] = caches[fontString] || {data: {}, gc: []};
 			lineHeight = tickFont.lineHeight;
@@ -1080,6 +1102,7 @@ class Scale extends Element {
 		const isMirrored = optionTicks.mirror;
 		const isHorizontal = me.isHorizontal();
 		const ticks = me.ticks;
+		const fonts = parseTickFontOptions(optionTicks);
 		const tickPadding = optionTicks.padding;
 		const tl = getTickMarkLength(options.gridLines);
 		const rotation = -helpers.math.toRadians(me.labelRotation);
@@ -1123,7 +1146,7 @@ class Scale extends Element {
 			label = tick.label;
 
 			pixel = me.getPixelForTick(i) + optionTicks.labelOffset;
-			font = me._resolveTickFontOptions(i);
+			font = tick.major ? fonts.major : fonts.minor;
 			lineHeight = font.lineHeight;
 			lineCount = isArray(label) ? label.length : 1;
 
@@ -1425,27 +1448,6 @@ class Scale extends Element {
 		}
 		return result;
 	}
-
-	_resolveTickFontOptions(index) {
-		const me = this;
-		const options = me.options.ticks;
-		const context = {
-			chart: me.chart,
-			scale: me,
-			tick: me.ticks[index],
-			index: index
-		};
-		return helpers.extend(helpers.options._parseFont({
-			fontFamily: resolve([options.fontFamily], context),
-			fontSize: resolve([options.fontSize], context),
-			fontStyle: resolve([options.fontStyle], context),
-			lineHeight: resolve([options.lineHeight], context)
-		}), {
-			color: resolve([options.fontColor, defaults.fontColor], context),
-			lineWidth: resolve([options.lineWidth], context),
-			strokeStyle: resolve([options.strokeStyle], context)
-		});
-	}
 }
 
 Scale.prototype._draw = Scale.prototype.draw;