fix(line): when data all gt 0, or lt 0, set the default min/max

Author: hustcc

__tests__/unit/plots/line/y-meta-min-max-spec.ts

@@ -0,0 +1,37 @@
+import { Line } from '../../../../src';
+import { createDiv } from '../../../utils/dom';
+
+describe('line', () => {
+  it('y min, max meta', () => {
+    const line = new Line(createDiv(), {
+      width: 400,
+      height: 300,
+      xField: 'date',
+      yField: 'value',
+      data: [
+        { date: 'a', value: 10 },
+        { date: 'b', value: 20 },
+      ],
+    });
+
+    line.render();
+    // @ts-ignore
+    window.line = line;
+    expect(line.options.meta.value.min).toBe(0);
+    expect(line.options.meta.value.max).toBe(undefined);
+
+    line.update({
+      width: 400,
+      height: 300,
+      xField: 'date',
+      yField: 'value',
+      data: [
+        { date: 'a', value: -10 },
+        { date: 'b', value: -20 },
+      ],
+    });
+
+    expect(line.options.meta.value.min).toBe(undefined);
+    expect(line.options.meta.value.max).toBe(0);
+  });
+});

__tests__/unit/utils/data-spec.ts

@@ -0,0 +1,9 @@
+import { adjustYMetaByZero } from '../../../src/utils/data';
+
+describe('data', () => {
+  it('adjustYMetaByZero', () => {
+    expect(adjustYMetaByZero([{ y: 0 }, { y: 1 }], 'y')).toEqual({});
+    expect(adjustYMetaByZero([{ y: 20 }, { y: 20 }], 'y')).toEqual({ min: 0 });
+    expect(adjustYMetaByZero([{ y: -20 }, { y: -20 }], 'y')).toEqual({ max: 0 });
+  });
+});

src/plots/line/index.ts

@@ -1,8 +1,10 @@
-import { deepMix } from '@antv/util';
+import { deepMix, size, reduce, get } from '@antv/util';
 import { Plot } from '../../core/plot';
 import { Adaptor } from '../../core/adaptor';
+import { adjustYMetaByZero } from '../../utils/data';
 import { LineOptions } from './types';
 import { adaptor } from './adaptor';
+
 import './interactions';
 
 export { LineOptions };
@@ -15,7 +17,8 @@ export class Line extends Plot<LineOptions> {
    * 获取 折线图 默认配置
    */
   protected getDefaultOptions(options: LineOptions) {
-    const { xField } = options;
+    const { xField, yField, data } = options;
+
     return deepMix({}, super.getDefaultOptions(), {
       tooltip: {
         showMarkers: true,
@@ -31,6 +34,9 @@ export class Line extends Plot<LineOptions> {
         [xField]: {
           range: [0, 1],
         },
+        [yField]: {
+          ...adjustYMetaByZero(data, yField),
+        },
       },
       isStack: false,
     });

src/types/axis.ts

@@ -1,47 +1,4 @@
 import { AxisOption } from '@antv/g2/lib/interface';
+import { Meta } from './meta';
 
-export type Axis = AxisOption & {
-  /**
-   * 坐标轴类型
-   */
-  readonly type?: string;
-  /**
-   * 是否美化
-   */
-  readonly nice?: boolean;
-
-  /**
-   * 坐标轴最小值
-   */
-  readonly min?: number;
-
-  /**
-   * 坐标轴最大值
-   */
-  readonly max?: number;
-
-  /**
-   * min limit
-   */
-  readonly minLimit?: number;
-
-  /**
-   * max limit
-   */
-  readonly maxLimit?: number;
-
-  /**
-   * 期望的坐标轴刻度数量，非最终结果
-   */
-  readonly tickCount?: number;
-
-  /**
-   * 坐标轴刻度间隔
-   */
-  readonly tickInterval?: number;
-
-  /**
-   * 指定 tick 计算方法或自定义计算 tick 的方法
-   */
-  readonly tickMethod?: string | ((scale: any) => any[]);
-};
+export type Axis = AxisOption & Omit<Meta, 'alias' | 'values' | 'formatter'>;

src/types/common.ts

@@ -10,6 +10,7 @@ import { State } from './state';
 import { Slider } from './slider';
 import { Scrollbar } from './scrollbar';
 import { ColorAttr } from './attr';
+import { Meta } from './meta';
 
 /** annotation position */
 export { AnnotationPosition, RegionPositionBaseOption, TextOption };
@@ -63,15 +64,6 @@ export type Size = {
   readonly height: number;
 };
 
-/** scale 元信息，取名为 meta */
-export type Meta = {
-  readonly type?: string;
-  readonly alias?: string;
-  readonly values?: string[];
-  readonly range?: number[];
-  readonly formatter?: (v: any) => string;
-};
-
 /** 基础的 Options 配置 */
 export type Options = {
   // 画布基本配置
@@ -102,7 +94,7 @@ export type Options = {
   /** 具体的数据 */
   readonly data: Record<string, any>[];
   /** 数据字段元信息 */
-  readonly meta?: Record<string, any>;
+  readonly meta?: Record<string, Meta>;
 
   // G2 相关
   /** 主题，G2 主题，字符串或者 theme object */

src/types/index.ts

@@ -3,3 +3,4 @@ export * from './tooltip';
 export * from './state';
 export * from './attr';
 export * from './statistic';
+export * from './meta';

src/types/meta.ts

@@ -0,0 +1,55 @@
+/** scale 元信息，取名为 meta */
+export type Meta = {
+  /**
+   * 坐标轴类型
+   */
+  readonly type?: string;
+  /**
+   * 是否美化
+   */
+  readonly nice?: boolean;
+  /**
+   * 坐标轴最小值
+   */
+  readonly min?: number;
+  /**
+   * 坐标轴最大值
+   */
+  readonly max?: number;
+  /**
+   * min limit
+   */
+  readonly minLimit?: number;
+  /**
+   * max limit
+   */
+  readonly maxLimit?: number;
+  /**
+   * 期望的坐标轴刻度数量，非最终结果
+   */
+  readonly tickCount?: number;
+  /**
+   * 坐标轴刻度间隔
+   */
+  readonly tickInterval?: number;
+  /**
+   * 指定 tick 计算方法或自定义计算 tick 的方法
+   */
+  readonly tickMethod?: string | ((scale: any) => any[]);
+  /**
+   * 字段别名
+   */
+  readonly alias?: string;
+  /**
+   * 指定 scale 中的 values 信息
+   */
+  readonly values?: string[];
+  /**
+   * scale 转换的范围，0 ~ 1 的数组，表示开始和结束的位置
+   */
+  readonly range?: number[];
+  /**
+   * 格式化 tick 值
+   */
+  readonly formatter?: (v: any) => string;
+};

src/utils/data.ts

@@ -0,0 +1,21 @@
+import { get, size } from '@antv/util';
+import sizeSensor from 'size-sensor';
+import { Data, Datum, Meta } from '../types';
+
+/**
+ * 查看数据是否是全负数、或者全正数
+ * @param data
+ * @param field
+ */
+export function adjustYMetaByZero(data: Data, field: string): Meta {
+  const gtZero = data.every((datum: Datum) => get(datum, [field]) > 0);
+  const ltZero = data.every((datum: Datum) => get(datum, [field]) < 0);
+
+  if (gtZero) {
+    return { min: 0 };
+  }
+  if (ltZero) {
+    return { max: 0 };
+  }
+  return {};
+}