feat: 面积图支持 startOnZero

__tests__/unit/plots/area/start-on-zero-spec.ts

@@ -0,0 +1,35 @@
+import { Area } from '../../../../src';
+import { createDiv } from '../../../utils/dom';
+
+describe('area', () => {
+  it('start on zero', () => {
+    const data = [
+      { date: '19/05/2006', type: 'FF', value: 3600 },
+      { date: '19/06/2006', type: 'FG', value: 2500 },
+      { date: '19/07/2006', type: 'Lab', value: -2000 },
+      { date: '19/08/2006', type: 'SF', value: 800 },
+      { date: '19/09/2006', type: 'Ind/Oth', value: 1700 },
+    ];
+    const area = new Area(createDiv(), {
+      width: 400,
+      height: 300,
+      data,
+      xField: 'date',
+      yField: 'value',
+      startOnZero: false,
+      isStack: false,
+    });
+
+    area.render();
+    const geometry = area.chart.geometries[0];
+    // @ts-ignore
+    expect(geometry.startOnZero).toBeFalsy();
+    expect(area.chart.getScaleByField('value').min).toBe(-2000);
+    area.update({
+      startOnZero: true,
+    });
+    // @ts-ignore
+    expect(area.chart.geometries[0].startOnZero).toBeTruthy();
+    area.destroy();
+  });
+});

docs/api/plots/area.en.md

@@ -47,6 +47,15 @@ Whether the plot is Stacked Area.
 
 Whether the plot is Percent Area. When the plot is Percent Area, isStack is `true` by default.
 
+#### startOnZero
+
+<description>**optional** _boolean_ _default:_ `true`</description>
+
+Whether the plot is filled from 0 datum，isStack must be false when used.
+
+<img alt='startOnZero-true' width='300' src='https://gw.alipayobjects.com/zos/rmsportal/ZQqwUCczalrKqGgagOVp.png'/>
+
+<img alt='startOnZero-false' width='300' src='https://gw.alipayobjects.com/zos/rmsportal/yPswkaXvUpCYOdhocGwB.png'/>
 #### areaStyle
 
 <description>**optional** _StyleAttr | Function_</description>

docs/api/plots/area.zh.md

@@ -47,6 +47,16 @@ order: 1
 
 是否百分比面积图，百分比时默认开启 isStack。
 
+#### startOnZero
+
+<description>**optional** _boolean_ _default:_ `true`</description>
+
+积图是否从 0 基准线开始填充，使用时 isStack 需为 false。
+
+<img alt='startOnZero-true' width='300' src='https://gw.alipayobjects.com/zos/rmsportal/ZQqwUCczalrKqGgagOVp.png'/>
+
+<img alt='startOnZero-false' width='300' src='https://gw.alipayobjects.com/zos/rmsportal/yPswkaXvUpCYOdhocGwB.png'/>
+
 #### areaStyle
 
 <description>**optional** _StyleAttr | Function_</description>

src/plots/area/adaptor.ts

@@ -29,6 +29,7 @@ function geometry(params: Params<AreaOptions>): Params<AreaOptions> {
     yField,
     tooltip,
     seriesField,
+    startOnZero,
   } = options;
   const pointState = pointMapping?.state;
 
@@ -60,6 +61,9 @@ function geometry(params: Params<AreaOptions>): Params<AreaOptions> {
       tooltip: tooltipOptions,
       // label 不传递给各个 geometry adaptor，由 label adaptor 处理
       label: undefined,
+      args: {
+        startOnZero,
+      },
     },
   });
   const second = deepAssign({}, primary, { options: { tooltip: false } });

src/plots/area/types.ts

@@ -22,4 +22,6 @@ export interface AreaOptions extends Options {
   readonly line?: LineGeometryOptions['line'];
   /** 面积图数据点图形样式 */
   readonly point?: PointGeometryOptions['point'] & Pick<PointGeometryOptions, 'state'>;
+  /** 积图是否从 0 基准线开始填充 */
+  readonly startOnZero?: boolean;
 }