Remove ticksToTimestamps and change ticks to numbers

Author: benmccann

docs/getting-started/v3-migration.md

@@ -168,9 +168,8 @@ Animation system was completely rewritten in Chart.js v3. Each property can now
 ##### Ticks
 
 * `Scale.afterBuildTicks` now has no parameters like the other callbacks
-* `Scale.buildTicks` is now expected to return tick objects
-* `Scale.convertTicksToLabels` was renamed to `generateTickLabels`. It is now expected to set the label property on the ticks given as input
-* `Scale.ticks` now contains objects instead of strings
+* `Scale.ticks` now contains the tick values instead of labels, which are now available in `Scale.labels`
+* `TimeScale.buildTicks` is now expected to return `number`s like the other scales
 * When the `autoSkip` option is enabled, `Scale.ticks` now contains only the non-skipped ticks instead of all ticks.
 
 ##### Time Scale

src/core/core.scale.js

@@ -192,18 +192,18 @@ function calculateSpacing(majorIndices, ticks, axisLength, ticksLimit) {
 	return Math.max(spacing, 1);
 }
 
-function getMajorIndices(ticks) {
+function getMajorIndices(meta) {
 	const result = [];
 	let i, ilen;
-	for (i = 0, ilen = ticks.length; i < ilen; i++) {
-		if (ticks[i].major) {
+	for (i = 0, ilen = meta.length; i < ilen; i++) {
+		if (meta[i] && meta[i].major) {
 			result.push(i);
 		}
 	}
 	return result;
 }
 
-function skipMajors(ticks, newTicks, majorIndices, spacing) {
+function skipMajors(ticks, meta, newTicks, newMeta, majorIndices, spacing) {
 	let count = 0;
 	let next = majorIndices[0];
 	let i;
@@ -212,13 +212,14 @@ function skipMajors(ticks, newTicks, majorIndices, spacing) {
 	for (i = 0; i < ticks.length; i++) {
 		if (i === next) {
 			newTicks.push(ticks[i]);
+			newMeta.push(meta[i]);
 			count++;
 			next = majorIndices[count * spacing];
 		}
 	}
 }
 
-function skip(ticks, newTicks, spacing, majorStart, majorEnd) {
+function skip(ticks, meta, newTicks, newMeta, spacing, majorStart, majorEnd) {
 	const start = valueOrDefault(majorStart, 0);
 	const end = Math.min(valueOrDefault(majorEnd, ticks.length), ticks.length);
 	let count = 0;
@@ -240,6 +241,7 @@ function skip(ticks, newTicks, spacing, majorStart, majorEnd) {
 	for (i = Math.max(start, 0); i < end; i++) {
 		if (i === next) {
 			newTicks.push(ticks[i]);
+			newMeta.push(meta[i]);
 			count++;
 			next = Math.round(start + count * spacing);
 		}
@@ -373,7 +375,7 @@ class Scale extends Element {
 		const me = this;
 		const tickOpts = me.options.ticks;
 		const sampleSize = tickOpts.sampleSize;
-		let samplingEnabled;
+		const autoSkipEnabled = tickOpts.autoSkip || tickOpts.source === 'auto';
 
 		// Update Lifecycle - Probably don't want to ever extend or overwrite this function ;)
 		me.beforeUpdate();
@@ -390,6 +392,7 @@ class Scale extends Element {
 		}, margins);
 
 		me.ticks = null;
+		me._tickMeta = [];
 		me._labelSizes = null;
 		me._maxLabelLines = 0;
 		me._longestTextCache = me._longestTextCache || {};
@@ -415,8 +418,8 @@ class Scale extends Element {
 
 		// Compute tick rotation and fit using a sampled subset of labels
 		// We generally don't need to compute the size of every single label for determining scale size
-		samplingEnabled = sampleSize < me.ticks.length;
-		me._convertTicksToLabels(samplingEnabled ? sample(me.ticks, sampleSize) : me.ticks);
+		const samplingEnabled = sampleSize < me.ticks.length;
+		me.labels = me._convertTicksToLabels(samplingEnabled ? sample(me.ticks, sampleSize) : me.ticks);
 
 		// _configure is called twice, once here, once from core.controller.updateLayout.
 		// Here we haven't been positioned yet, but dimensions are correct.
@@ -434,11 +437,13 @@ class Scale extends Element {
 		me.afterFit();
 
 		// Auto-skip
-		me.ticks = tickOpts.display && (tickOpts.autoSkip || tickOpts.source === 'auto') ? me._autoSkip(me.ticks) : me.ticks;
+		if (tickOpts.display && autoSkipEnabled) {
+			me._autoSkip();
+		}
 
-		if (samplingEnabled) {
+		if (tickOpts.display && (samplingEnabled || autoSkipEnabled)) {
 			// Generate labels using all non-skipped ticks
-			me._convertTicksToLabels(me.ticks);
+			me.labels = me._convertTicksToLabels(me.ticks);
 		}
 
 		// IMPORTANT: after this point, we consider that `this.ticks` will NEVER change!
@@ -528,14 +533,15 @@ class Scale extends Element {
 	/**
 	 * Convert ticks to label strings
 	 */
-	generateTickLabels(ticks) {
+	convertTicksToLabels(ticks) {
 		const me = this;
 		const tickOpts = me.options.ticks;
-		let i, ilen, tick;
+		const labels = [];
+		let i, ilen;
 		for (i = 0, ilen = ticks.length; i < ilen; i++) {
-			tick = ticks[i];
-			tick.label = helpers.callback(tickOpts.callback, [tick.value, i, ticks], me);
+			labels[i] = helpers.callback(tickOpts.callback, [ticks[i], i, ticks], me);
 		}
+		return labels;
 	}
 	afterTickToLabelConversion() {
 		helpers.callback(this.options.afterTickToLabelConversion, [this]);
@@ -729,9 +735,11 @@ class Scale extends Element {
 
 		me.beforeTickToLabelConversion();
 
-		me.generateTickLabels(ticks);
+		const labels = me.convertTicksToLabels(ticks);
 
 		me.afterTickToLabelConversion();
+
+		return labels;
 	}
 
 	/**
@@ -762,16 +770,17 @@ class Scale extends Element {
 		const widths = [];
 		const heights = [];
 		const offsets = [];
-		let ticks = me.ticks;
-		if (sampleSize < ticks.length) {
-			ticks = sample(ticks, sampleSize);
+		let labels = me.labels;
+		if (sampleSize < labels.length) {
+			labels = sample(labels, sampleSize);
 		}
-		const length = ticks.length;
-		let i, j, jlen, label, tickFont, fontString, cache, lineHeight, width, height, nestedLabel, widest, highest;
+		const length = labels.length;
+		let i, j, jlen, label, meta, tickFont, fontString, cache, lineHeight, width, height, nestedLabel, widest, highest;
 
 		for (i = 0; i < length; ++i) {
-			label = ticks[i].label;
-			tickFont = ticks[i].major ? tickFonts.major : tickFonts.minor;
+			label = labels[i];
+			meta = me._tickMeta[i];
+			tickFont = meta && meta.major ? tickFonts.major : tickFonts.minor;
 			ctx.font = fontString = tickFont.string;
 			cache = caches[fontString] = caches[fontString] || {data: {}, gc: []};
 			lineHeight = tickFont.lineHeight;
@@ -894,37 +903,46 @@ class Scale extends Element {
 	 * Returns a subset of ticks to be plotted to avoid overlapping labels.
 	 * @private
 	 */
-	_autoSkip(ticks) {
+	_autoSkip() {
 		const me = this;
 		const tickOpts = me.options.ticks;
+		const ticks = me.ticks;
+		const meta = me._tickMeta;
 		const axisLength = me._length;
 		const ticksLimit = tickOpts.maxTicksLimit || axisLength / me._tickSize();
-		const majorIndices = tickOpts.major.enabled ? getMajorIndices(ticks) : [];
+		const majorIndices = tickOpts.major.enabled ? getMajorIndices(meta) : [];
 		const numMajorIndices = majorIndices.length;
 		const first = majorIndices[0];
 		const last = majorIndices[numMajorIndices - 1];
 		const newTicks = [];
+		const newMeta = [];
 
 		// If there are too many major ticks to display them all
 		if (numMajorIndices > ticksLimit) {
-			skipMajors(ticks, newTicks, majorIndices, numMajorIndices / ticksLimit);
-			return newTicks;
+			skipMajors(ticks, meta, newTicks, newMeta, majorIndices, numMajorIndices / ticksLimit);
+			me._tickMeta = newMeta;
+			me.ticks = newTicks;
+			return;
 		}
 
 		const spacing = calculateSpacing(majorIndices, ticks, axisLength, ticksLimit);
 
 		if (numMajorIndices > 0) {
 			let i, ilen;
 			const avgMajorSpacing = numMajorIndices > 1 ? Math.round((last - first) / (numMajorIndices - 1)) : null;
-			skip(ticks, newTicks, spacing, helpers.isNullOrUndef(avgMajorSpacing) ? 0 : first - avgMajorSpacing, first);
+			skip(ticks, meta, newTicks, newMeta, spacing, helpers.isNullOrUndef(avgMajorSpacing) ? 0 : first - avgMajorSpacing, first);
 			for (i = 0, ilen = numMajorIndices - 1; i < ilen; i++) {
-				skip(ticks, newTicks, spacing, majorIndices[i], majorIndices[i + 1]);
+				skip(ticks, meta, newTicks, newMeta, spacing, majorIndices[i], majorIndices[i + 1]);
 			}
-			skip(ticks, newTicks, spacing, last, helpers.isNullOrUndef(avgMajorSpacing) ? ticks.length : last + avgMajorSpacing);
-			return newTicks;
+			skip(ticks, meta, newTicks, newMeta, spacing, last, helpers.isNullOrUndef(avgMajorSpacing) ? ticks.length : last + avgMajorSpacing);
+			me._tickMeta = newMeta;
+			me.ticks = newTicks;
+			return;
 		}
-		skip(ticks, newTicks, spacing);
-		return newTicks;
+		skip(ticks, meta, newTicks, newMeta, spacing);
+		me._tickMeta = newMeta;
+		me.ticks = newTicks;
+		return;
 	}
 
 	/**
@@ -946,8 +964,8 @@ class Scale extends Element {
 
 		// Calculate space needed for 1 tick in axis direction.
 		return me.isHorizontal()
-			? h * cos > w * sin ? w / cos : h / sin
-			: h * sin < w * cos ? h / cos : w / sin;
+			? (h * cos > w * sin ? w / cos : h / sin)
+			: (h * sin < w * cos ? h / cos : w / sin);
 	}
 
 	/**
@@ -1109,7 +1127,7 @@ class Scale extends Element {
 		const tl = getTickMarkLength(options.gridLines);
 		const rotation = -helpers.math.toRadians(me.labelRotation);
 		const items = [];
-		let i, ilen, tick, label, x, y, textAlign, pixel, font, lineHeight, lineCount, textOffset;
+		let i, ilen, meta, label, x, y, textAlign, pixel, font, lineHeight, lineCount, textOffset;
 
 		if (position === 'top') {
 			y = me.bottom - tl - tickPadding;
@@ -1144,11 +1162,11 @@ class Scale extends Element {
 		}
 
 		for (i = 0, ilen = ticks.length; i < ilen; ++i) {
-			tick = ticks[i];
-			label = tick.label;
+			meta = me._tickMeta[i];
+			label = me.labels[i];
 
 			pixel = me.getPixelForTick(i) + optionTicks.labelOffset;
-			font = tick.major ? fonts.major : fonts.minor;
+			font = meta && meta.major ? fonts.major : fonts.minor;
 			lineHeight = font.lineHeight;
 			lineCount = isArray(label) ? label.length : 1;
 

src/core/core.ticks.js

@@ -33,7 +33,7 @@ export default {
 		 */
 		linear: function(tickValue, index, ticks) {
 			// If we have lots of ticks, don't use the ones
-			var delta = ticks.length > 3 ? ticks[2].value - ticks[1].value : ticks[1].value - ticks[0].value;
+			var delta = ticks.length > 3 ? ticks[2] - ticks[1] : ticks[1] - ticks[0];
 
 			// If we have a number like 2.5 as the delta, figure out how many decimal places we need
 			if (Math.abs(delta) > 1) {
@@ -47,7 +47,7 @@ export default {
 			var tickString = '';
 
 			if (tickValue !== 0) {
-				var maxTick = Math.max(Math.abs(ticks[0].value), Math.abs(ticks[ticks.length - 1].value));
+				var maxTick = Math.max(Math.abs(ticks[0]), Math.abs(ticks[ticks.length - 1]));
 				if (maxTick < 1e-4) { // all ticks are small numbers; use scientific notation
 					var logTick = math.log10(Math.abs(tickValue));
 					var numExponential = Math.floor(logTick) - Math.floor(logDelta);

src/helpers/helpers.math.js

@@ -58,6 +58,18 @@ export function almostWhole(x, epsilon) {
 	return ((rounded - epsilon) <= x) && ((rounded + epsilon) >= x);
 }
 
+export function _setMinAndMax(array, target) {
+	var i, ilen, value;
+
+	for (i = 0, ilen = array.length; i < ilen; i++) {
+		value = array[i];
+		if (!isNaN(value)) {
+			target.min = Math.min(target.min, value);
+			target.max = Math.max(target.max, value);
+		}
+	}
+}
+
 export function _setMinAndMaxByKey(array, target, property) {
 	var i, ilen, value;
 

src/scales/scale.category.js

@@ -35,9 +35,7 @@ class CategoryScale extends Scale {
 		me._valueRange = Math.max(labels.length - (offset ? 0 : 1), 1);
 		me._startValue = me.min - (offset ? 0.5 : 0);
 
-		return labels.map(function(l) {
-			return {value: l};
-		});
+		return labels;
 	}
 
 	getLabelForValue(value) {

src/scales/scale.linear.js

@@ -67,7 +67,7 @@ class LinearScale extends LinearScaleBase {
 		if (index < 0 || index > ticks.length - 1) {
 			return null;
 		}
-		return this.getPixelForValue(ticks[index].value);
+		return this.getPixelForValue(ticks[index]);
 	}
 }
 

src/scales/scale.linearbase.js

@@ -1,7 +1,7 @@
 'use strict';
 
 import helpers from '../helpers/index';
-import {almostEquals, almostWhole, _decimalPlaces, _setMinAndMaxByKey, sign} from '../helpers/helpers.math';
+import {almostEquals, almostWhole, _decimalPlaces, _setMinAndMax, sign} from '../helpers/helpers.math';
 import Scale from '../core/core.scale';
 
 const isNullOrUndef = helpers.isNullOrUndef;
@@ -33,7 +33,7 @@ function generateTicks(generationOptions, dataRange) {
 	// Beyond MIN_SPACING floating point numbers being to lose precision
 	// such that we can't do the math necessary to generate ticks
 	if (spacing < MIN_SPACING && isNullOrUndef(min) && isNullOrUndef(max)) {
-		return [{value: rmin}, {value: rmax}];
+		return [rmin, rmax];
 	}
 
 	numSpaces = Math.ceil(rmax / spacing) - Math.floor(rmin / spacing);
@@ -75,11 +75,11 @@ function generateTicks(generationOptions, dataRange) {
 
 	niceMin = Math.round(niceMin * factor) / factor;
 	niceMax = Math.round(niceMax * factor) / factor;
-	ticks.push({value: isNullOrUndef(min) ? niceMin : min});
+	ticks.push(isNullOrUndef(min) ? niceMin : min);
 	for (var j = 1; j < numSpaces; ++j) {
-		ticks.push({value: Math.round((niceMin + j * spacing) * factor) / factor});
+		ticks.push(Math.round((niceMin + j * spacing) * factor) / factor);
 	}
-	ticks.push({value: isNullOrUndef(max) ? niceMax : max});
+	ticks.push(isNullOrUndef(max) ? niceMax : max);
 
 	return ticks;
 }
@@ -216,7 +216,7 @@ class LinearScaleBase extends Scale {
 
 		// At this point, we need to update our max and min given the tick values since we have expanded the
 		// range of the scale
-		_setMinAndMaxByKey(ticks, me, 'value');
+		_setMinAndMax(ticks, me);
 
 		if (opts.reverse) {
 			ticks.reverse();