feat: 重写瀑布图changeData方法 && 添加单测 (#2212)

Co-authored-by: 沈建斌 <[email protected]>

Author: yp0413150120

__tests__/unit/plots/waterfall/change-data-spec.ts

@@ -0,0 +1,46 @@
+import { Waterfall } from '../../../../src';
+import { salesByArea } from '../../../data/sales';
+import { createDiv } from '../../../utils/dom';
+
+describe('waterfall changeData', () => {
+  it('changeData: normal', () => {
+    const waterfall = new Waterfall(createDiv(), {
+      width: 400,
+      height: 300,
+      data: salesByArea,
+      xField: 'area',
+      yField: 'sales',
+    });
+
+    waterfall.render();
+
+    expect(waterfall.chart.geometries[0].elements.length).toEqual(salesByArea.length + 1);
+
+    const newData = salesByArea.slice(0, 4);
+    waterfall.changeData(newData);
+    expect(waterfall.chart.geometries[0].elements.length).toEqual(newData.length + 1);
+    expect(waterfall.options.data).toEqual(newData);
+
+    waterfall.destroy();
+  });
+
+  it('changeData: from empty to have data', () => {
+    const waterfall = new Waterfall(createDiv(), {
+      width: 400,
+      height: 300,
+      data: [],
+      xField: 'area',
+      yField: 'sales',
+    });
+
+    waterfall.render();
+
+    expect(waterfall.chart.geometries[0].elements.length).toEqual(0);
+
+    waterfall.changeData(salesByArea);
+    expect(waterfall.chart.geometries[0].elements.length).toEqual(salesByArea.length + 1);
+    expect(waterfall.options.data).toEqual(salesByArea);
+
+    waterfall.destroy();
+  });
+});

src/plots/waterfall/index.ts

@@ -2,6 +2,7 @@ import { Plot } from '../../core/plot';
 import { Adaptor } from '../../core/adaptor';
 import { WaterfallOptions } from './types';
 import { adaptor } from './adaptor';
+import { transformData } from './utils';
 
 export { WaterfallOptions };
 
@@ -12,6 +13,16 @@ export class Waterfall extends Plot<WaterfallOptions> {
   /** 图表类型 */
   public readonly type: string = 'waterfall';
 
+  /**
+   * @override
+   * @param data
+   */
+  public changeData(data) {
+    const { xField, yField, total } = this.options;
+    this.updateOption({ data });
+    this.chart.changeData(transformData(data, xField, yField, total));
+  }
+
   /**
    * 获取 瀑布图 的适配器
    */