diff --git a/packages/f2/src/components/legend/withLegend.tsx b/packages/f2/src/components/legend/withLegend.tsx index 61927aa37..bda0044fe 100644 --- a/packages/f2/src/components/legend/withLegend.tsx +++ b/packages/f2/src/components/legend/withLegend.tsx @@ -223,6 +223,7 @@ export default (View) => { willUpdate(): void { const items = this.getItems(); if (!items || !items.length) return; + this._init(); this.updateCoord(); } diff --git a/packages/f2/test/components/canvas/__image_snapshots__/canvas-test-tsx-canvas-chart-resize-legend-1-snap.png b/packages/f2/test/components/canvas/__image_snapshots__/canvas-test-tsx-canvas-chart-resize-legend-1-snap.png new file mode 100644 index 000000000..1a93a672a Binary files /dev/null and b/packages/f2/test/components/canvas/__image_snapshots__/canvas-test-tsx-canvas-chart-resize-legend-1-snap.png differ diff --git a/packages/f2/test/components/canvas/canvas.test.tsx b/packages/f2/test/components/canvas/canvas.test.tsx index ae7fe1725..4ef7e1d1c 100644 --- a/packages/f2/test/components/canvas/canvas.test.tsx +++ b/packages/f2/test/components/canvas/canvas.test.tsx @@ -1,6 +1,7 @@ import { jsx } from '../../../src'; import { createContext, delay } from '../../util'; -import { Canvas, Component, Chart, Interval } from '../../../src'; +import { Canvas, Component, Chart, Interval, Legend } from '../../../src'; + const context = createContext('', { width: '300px', height: '300px', @@ -13,6 +14,25 @@ const data = [ { type: 'a', genre: 'Shooter', sold: 20 }, { type: 'a', genre: 'Other', sold: 40 }, ]; + +const data2 = [ + { type: '增额终身寿', genre: 'Sports', sold: 5 }, + { type: '增额终身寿', genre: 'Strategy', sold: 10 }, + { type: '增额终身寿', genre: 'Action', sold: 20 }, + { type: '增额终身寿', genre: 'Shooter', sold: 20 }, + { type: '增额终身寿', genre: 'Other', sold: 40 }, + { type: '增额终身寿2.0', genre: 'Sports', sold: 3 }, + { type: '增额终身寿2.0', genre: 'Strategy', sold: 7 }, + { type: '增额终身寿2.0', genre: 'Action', sold: 16 }, + { type: '增额终身寿2.0', genre: 'Shooter', sold: 18 }, + { type: '增额终身寿2.0', genre: 'Other', sold: 37 }, + { type: '鑫相守增额寿', genre: 'Sports', sold: 2 }, + { type: '鑫相守增额寿', genre: 'Strategy', sold: 6 }, + { type: '鑫相守增额寿', genre: 'Action', sold: 16 }, + { type: '鑫相守增额寿', genre: 'Shooter', sold: 18 }, + { type: '鑫相守增额寿', genre: 'Other', sold: 32 }, +]; + class Test extends Component { render() { return ( @@ -76,4 +96,27 @@ describe('Canvas', () => { await delay(1000); expect(context).toMatchImageSnapshot(); }); + + it('chart resize legend', async () => { + const chartRef = { current: null }; + const context = createContext('chart resize legend'); + const width = 300; + const height = 300; + const { type, props } = ( + + + + + + + ); + + const canvas = new Canvas(props); + await canvas.render(); + + await delay(1000); + await canvas.resize(200, 200); + await delay(1000); + expect(context).toMatchImageSnapshot(); + }); });