diff --git a/__tests__/unit/plots/waterfall/change-data-spec.ts b/__tests__/unit/plots/waterfall/change-data-spec.ts new file mode 100644 index 0000000000..56d927a5e3 --- /dev/null +++ b/__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(); + }); +}); diff --git a/src/plots/waterfall/index.ts b/src/plots/waterfall/index.ts index 1e6c0cc7f2..a8b24cd604 100644 --- a/src/plots/waterfall/index.ts +++ b/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 { /** 图表类型 */ 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)); + } + /** * 获取 瀑布图 的适配器 */