fix(alignTicks): Change alignTick strategy: (1) Previously some series data may be out of the calculated extent and can not be displayed. (2) Previously the precision is incorrect for small float number (fixed at 10 rather than based on the magnitude of the value). (3) Make the tick precision more acceptable when min/max of axis is fixed, and remove console warning, because whey can be specified when dataZoom dragging. (4) Clarify the related code for LogScale.

Author: 100pah

src/coord/axisAlignTicks.ts

@@ -210,10 +210,10 @@ export interface ValueAxisBaseOption extends NumericAxisBaseOptionCommon {
 
     /**
      * Optional value can be:
-     * + `false`: always include value 0.
+     * + `false`: always include value 0 if not conflict with `axis.min/max` setting.
      * + `true`: the axis may not contain zero position.
      */
-     scale?: boolean;
+    scale?: boolean;
 }
 export interface LogAxisBaseOption extends NumericAxisBaseOptionCommon {
     type?: 'log';

src/coord/axisCommonTypes.ts

@@ -46,26 +46,35 @@ import CartesianAxisModel from './cartesian/AxisModel';
 import SeriesData from '../data/SeriesData';
 import { getStackedDimension } from '../data/helper/dataStackHelper';
 import { Dictionary, DimensionName, ScaleTick } from '../util/types';
-import { ensureScaleRawExtentInfo } from './scaleRawExtentInfo';
+import { ensureScaleRawExtentInfo, ScaleRawExtentResult } from './scaleRawExtentInfo';
 import { parseTimeAxisLabelFormatter } from '../util/time';
 import { getScaleBreakHelper } from '../scale/break';
 import { error } from '../util/log';
+import { isIntervalScale, isTimeScale } from '../scale/helper';
 
 
 type BarWidthAndOffset = ReturnType<typeof makeColumnLayout>;
 
 /**
- * Get axis scale extent before niced.
+ * Prepare axis scale extent before niced.
  * Item of returned array can only be number (including Infinity and NaN).
  *
- * Caution:
- * Precondition of calling this method:
- * The scale extent has been initialized using series data extent via
- * `scale.setExtent` or `scale.unionExtentFromData`;
+ * CAVEAT:
+ *  This function has side-effect.
+ *
+ * FIXME:
+ *  Refector to decouple `unionExtentFromData` and irregular value handling from `scale`.
+ *  Merge `unionAxisExtentFromData` and `unionExtentFromData`.
+ *  Refector `ensureScaleRawExtentInfo`.
  */
-export function getScaleExtent(scale: Scale, model: AxisBaseModel) {
-    const scaleType = scale.type;
-    const rawExtentResult = ensureScaleRawExtentInfo(scale, model, scale.getExtent()).calculate();
+export function adoptScaleExtentOptionAndPrepare(
+    scale: Scale,
+    model: AxisBaseModel,
+    // Typically: data extent from all series on this axis.
+    // Can be obtained by `scale.unionExtentFromData(); scale.getExtent()`;
+    dataExtent: number[]
+): ScaleRawExtentResult {
+    const rawExtentResult = ensureScaleRawExtentInfo(scale, model, dataExtent).calculate();
 
     scale.setBlank(rawExtentResult.isBlank);
 
@@ -82,7 +91,7 @@ export function getScaleExtent(scale: Scale, model: AxisBaseModel) {
     // (4) Consider other chart types using `barGrid`?
     // See #6728, #4862, `test/bar-overflow-time-plot.html`
     const ecModel = model.ecModel;
-    if (ecModel && (scaleType === 'time' /* || scaleType === 'interval' */)) {
+    if (ecModel && (isTimeScale(scale) /* || scaleType === 'interval' */)) {
         const barSeriesModels = prepareLayoutBarSeries('bar', ecModel);
         let isBaseAxisAndHasBarSeries = false;
 
@@ -102,13 +111,10 @@ export function getScaleExtent(scale: Scale, model: AxisBaseModel) {
         }
     }
 
-    return {
-        extent: [min, max],
-        // "fix" means "fixed", the value should not be
-        // changed in the subsequent steps.
-        fixMin: rawExtentResult.minFixed,
-        fixMax: rawExtentResult.maxFixed
-    };
+    rawExtentResult.min = min;
+    rawExtentResult.max = max;
+
+    return rawExtentResult;
 }
 
 function adjustScaleForOverflow(
@@ -151,32 +157,25 @@ function adjustScaleForOverflow(
     return {min: min, max: max};
 }
 
-// Precondition of calling this method:
-// The scale extent has been initialized using series data extent via
-// `scale.setExtent` or `scale.unionExtentFromData`;
 export function niceScaleExtent(
     scale: Scale,
-    inModel: AxisBaseModel
-) {
+    inModel: AxisBaseModel,
+    // Typically: data extent from all series on this axis, which can be obtained by
+    //  `scale.unionExtentFromData(...); scale.getExtent();`.
+    dataExtent: number[],
+): void {
     const model = inModel as AxisBaseModel<LogAxisBaseOption>;
-    const extentInfo = getScaleExtent(scale, model);
-    const extent = extentInfo.extent;
-    const splitNumber = model.get('splitNumber');
-
-    if (scale instanceof LogScale) {
-        scale.base = model.get('logBase');
-    }
+    const extentInfo = adoptScaleExtentOptionAndPrepare(scale, model, dataExtent);
 
-    const scaleType = scale.type;
-    const interval = model.get('interval');
-    const isIntervalOrTime = scaleType === 'interval' || scaleType === 'time';
+    const isInterval = isIntervalScale(scale);
+    const isIntervalOrTime = isInterval || isTimeScale(scale);
 
     scale.setBreaksFromOption(retrieveAxisBreaksOption(model));
-    scale.setExtent(extent[0], extent[1]);
+    scale.setExtent(extentInfo.min, extentInfo.max);
     scale.calcNiceExtent({
-        splitNumber: splitNumber,
-        fixMin: extentInfo.fixMin,
-        fixMax: extentInfo.fixMax,
+        splitNumber: model.get('splitNumber'),
+        fixMin: extentInfo.minFixed,
+        fixMax: extentInfo.maxFixed,
         minInterval: isIntervalOrTime ? model.get('minInterval') : null,
         maxInterval: isIntervalOrTime ? model.get('maxInterval') : null
     });
@@ -185,36 +184,35 @@ export function niceScaleExtent(
     // is not good enough. He can specify the interval. It is often appeared
     // in angle axis with angle 0 - 360. Interval calculated in interval scale is hard
     // to be 60.
-    // FIXME
-    if (interval != null) {
-        (scale as IntervalScale).setInterval && (scale as IntervalScale).setInterval(interval);
+    // In `xxxAxis.type: 'log'`, ec option `xxxAxis.interval` requires a logarithm-applied
+    // value rather than a value in the raw scale.
+    const interval = model.get('interval');
+    if (interval != null && (scale as IntervalScale).setInterval) {
+        (scale as IntervalScale).setInterval({interval});
     }
 }
 
-/**
- * @param axisType Default retrieve from model.type
- */
-export function createScaleByModel(model: AxisBaseModel, axisType?: string): Scale {
-    axisType = axisType || model.get('type');
-    if (axisType) {
-        switch (axisType) {
-            // Buildin scale
-            case 'category':
-                return new OrdinalScale({
-                    ordinalMeta: model.getOrdinalMeta
-                        ? model.getOrdinalMeta()
-                        : model.getCategories(),
-                    extent: [Infinity, -Infinity]
-                });
-            case 'time':
-                return new TimeScale({
-                    locale: model.ecModel.getLocaleModel(),
-                    useUTC: model.ecModel.get('useUTC'),
-                });
-            default:
-                // case 'value'/'interval', 'log', or others.
-                return new (Scale.getClass(axisType) || IntervalScale)();
-        }
+export function createScaleByModel(model: AxisBaseModel): Scale {
+    const axisType = model.get('type');
+    switch (axisType) {
+        case 'category':
+            return new OrdinalScale({
+                ordinalMeta: model.getOrdinalMeta
+                    ? model.getOrdinalMeta()
+                    : model.getCategories(),
+                extent: [Infinity, -Infinity]
+            });
+        case 'time':
+            return new TimeScale({
+                locale: model.ecModel.getLocaleModel(),
+                useUTC: model.ecModel.get('useUTC'),
+            });
+        case 'log':
+            // See also #3749
+            return new LogScale((model as AxisBaseModel<LogAxisBaseOption>).get('logBase'));
+        default:
+            // case 'value'/'interval', or others.
+            return new (Scale.getClass(axisType) || IntervalScale)();
     }
 }
 
@@ -303,7 +301,6 @@ export function getAxisRawValue<TIsCategory extends boolean>(axis: Axis, tick: S
 
 /**
  * @param model axisLabelModel or axisTickModel
- * @return {number|String} Can be null|'auto'|number|function
  */
 export function getOptionCategoryInterval(
     model: Model<AxisBaseOption['axisLabel']>

src/coord/axisHelper.ts

@@ -31,8 +31,7 @@ interface AxisModelCommonMixin<Opt extends AxisBaseOption> extends Pick<Model<Op
 class AxisModelCommonMixin<Opt extends AxisBaseOption> {
 
     getNeedCrossZero(): boolean {
-        const option = this.option as ValueAxisBaseOption;
-        return !option.scale;
+        return !(this.option as ValueAxisBaseOption).scale;
     }
 
     /**

src/coord/axisModelCommonMixin.ts

@@ -32,6 +32,7 @@ import {
     getDataDimensionsOnAxis,
     isNameLocationCenter,
     shouldAxisShow,
+    retrieveAxisBreaksOption,
 } from '../../coord/axisHelper';
 import Cartesian2D, {cartesian2DDimensions} from './Cartesian2D';
 import Axis2D from './Axis2D';
@@ -124,50 +125,32 @@ class Grid implements CoordinateSystemMaster {
         this._updateScale(ecModel, this.model);
 
         function updateAxisTicks(axes: Record<number, Axis2D>) {
-            let alignTo: Axis2D;
             // Axis is added in order of axisIndex.
             const axesIndices = keys(axes);
-            const len = axesIndices.length;
-            if (!len) {
-                return;
-            }
             const axisNeedsAlign: Axis2D[] = [];
-            // Process once and calculate the ticks for those don't use alignTicks.
-            for (let i = len - 1; i >= 0; i--) {
-                const idx = +axesIndices[i];    // Convert to number.
-                const axis = axes[idx];
-                const model = axis.model as AxisBaseModel<NumericAxisBaseOptionCommon>;
-                const scale = axis.scale;
-                if (// Only value and log axis without interval support alignTicks.
-                    isIntervalOrLogScale(scale)
-                    && model.get('alignTicks')
-                    && model.get('interval') == null
-                ) {
+
+            for (let i = axesIndices.length - 1; i >= 0; i--) { // Reverse order
+                const axis = axes[+axesIndices[i]];
+                if (axis.alignTo) {
                     axisNeedsAlign.push(axis);
                 }
                 else {
-                    niceScaleExtent(scale, model);
-                    if (isIntervalOrLogScale(scale)) {  // Can only align to interval or log axis.
-                        alignTo = axis;
-                    }
+                    niceScaleExtent(axis.scale, axis.model, axis.scale.getExtent());
                 }
             };
-            // All axes has set alignTicks. Pick the first one.
-            // PENDING. Should we find the axis that both set interval, min, max and align to this one?
-            if (axisNeedsAlign.length) {
-                if (!alignTo) {
-                    alignTo = axisNeedsAlign.pop();
-                    niceScaleExtent(alignTo.scale, alignTo.model);
+            each(axisNeedsAlign, axis => {
+                if (incapableOfAlignNeedFallback(axis, axis.alignTo as Axis2D)) {
+                    niceScaleExtent(axis.scale, axis.model, axis.scale.getExtent());
                 }
-
-                each(axisNeedsAlign, axis => {
+                else {
                     alignScaleTicks(
                         axis.scale as IntervalScale | LogScale,
+                        axis.scale.getExtent(),
                         axis.model,
-                        alignTo.scale as IntervalScale | LogScale
+                        axis.alignTo.scale as IntervalScale | LogScale
                     );
-                });
-            }
+                }
+            });
         }
 
         updateAxisTicks(axesMap.x);
@@ -450,6 +433,9 @@ class Grid implements CoordinateSystemMaster {
             });
         });
 
+        prepareAlignToInCoordSysCreate(axesMap.x);
+        prepareAlignToInCoordSysCreate(axesMap.y);
+
         function createAxisCreator(dimName: Cartesian2DDimensionName) {
             return function (axisModel: CartesianAxisModel, idx: number): void {
                 if (!isAxisUsedInTheGrid(axisModel, gridModel)) {
@@ -698,6 +684,66 @@ function canOnZeroToAxis(axis: Axis2D): boolean {
     return axis && axis.type !== 'category' && axis.type !== 'time' && ifAxisCrossZero(axis);
 }
 
+/**
+ * [CAVEAT] This method is called before data processing stage.
+ *  Do not rely on any info that is determined afterward.
+ */
+function prepareAlignToInCoordSysCreate(axes: Record<number, Axis2D>): void {
+    // Axis is added in order of axisIndex.
+    const axesIndices = keys(axes);
+
+    let alignTo: Axis2D;
+    const axisNeedsAlign: Axis2D[] = [];
+
+    for (let i = axesIndices.length - 1; i >= 0; i--) { // Reverse order
+        const axis = axes[+axesIndices[i]];
+        if (
+            isIntervalOrLogScale(axis.scale)
+            // NOTE: `scale.hasBreaks()` is not available at this moment. Check it later.
+            && retrieveAxisBreaksOption(axis.model) == null
+            // NOTE: `scale.getTicks()` is not available at this moment. Check it later.
+        ) {
+            // Request `alignTicks`.
+            if ((axis.model as AxisBaseModel<NumericAxisBaseOptionCommon>).get('alignTicks')
+                && (axis.model as AxisBaseModel<NumericAxisBaseOptionCommon>).get('interval') == null
+            ) {
+                axisNeedsAlign.push(axis);
+            }
+            else {
+                // `alignTo` the last one that does not request `alignTicks`
+                // (This rule is retained for backward compat).
+                alignTo = axis;
+            }
+        }
+    };
+    // If all axes has set alignTicks, pick the first one as alignTo.
+    // PENDING. Should we find the axis that both set interval, min, max and align to this one?
+    // PENDING. Should we allow specifying alignTo via ec option?
+    if (!alignTo) {
+        alignTo = axisNeedsAlign.pop();
+    }
+    if (alignTo) {
+        each(axisNeedsAlign, function (axis) {
+            axis.alignTo = alignTo;
+        });
+    }
+}
+
+/**
+ *  This is just a defence code. They are unlikely to be actually `true`,
+ *  since these cases have been addressed in `prepareAlignToInCoordSysCreate`.
+ *
+ *  Can not be called BEFORE "nice" performed.
+ */
+function incapableOfAlignNeedFallback(targetAxis: Axis2D, alignTo: Axis2D): boolean {
+    return targetAxis.scale.hasBreaks()
+        || alignTo.scale.hasBreaks()
+        // Normally ticks length are more than 2 even when axis is blank.
+        // But still guard for corner cases and possible changes.
+        || alignTo.scale.getTicks().length < 2;
+}
+
+
 function updateAxisTransform(axis: Axis2D, coordBase: number) {
     const axisExtent = axis.getExtent();
     const axisExtentSum = axisExtent[0] + axisExtent[1];

src/coord/cartesian/Grid.ts

@@ -241,7 +241,7 @@ function shrinkAxisExtent(axisRecordMap: HashMap<AxisRecord>) {
         if (tarAxisExtent) {
             const rawExtentResult = axisRecord.rawExtentResult;
             const rawExtentInfo = axisRecord.rawExtentInfo;
-            // Shink the original extent.
+            // Shrink the original extent.
             if (!rawExtentResult.minFixed && tarAxisExtent[0] > rawExtentResult.min) {
                 rawExtentInfo.modifyDataMinMax('min', tarAxisExtent[0]);
             }