Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat(chart): debounce chart.render #5083

Merged
merged 1 commit into from
May 24, 2023
Merged

feat(chart): debounce chart.render #5083

merged 1 commit into from
May 24, 2023

Conversation

pearmini
Copy link
Member

@pearmini pearmini commented May 24, 2023

chart.render

对 chart.render 进行防抖处理:如果当图表在渲染中的时候,会推迟新的渲染任务,如果当前已经有推迟的渲染任务,那么覆盖。

思路

因为 chart.render 是一个异步的方法,所以不能被取消。当连续多次调用 chart.render 的时候,只有等当前的执行完,然后执行最新的那个渲染任务。

案例

依次渲染

const chart = new Chart(options);

let count = 0;
chart.on(ChartEvent.BEFORE_RENDER, () => {
  count++;
});
const p1 = chart.render().then(() => expect(count).toBe(1));
const p2 = chart.render().then(() => expect(count).toBe(2));

渲染前后两次

const chart = new Chart(options);

let count = 0;
chart.on(ChartEvent.AFTER_RENDER, () => {
  count++;
});

chart.render();
chart.render();
chart.render();
chart.render();

expect(count).toBe(2); // 只有第一次和最后一次被渲染了。

@pearmini pearmini requested review from hustcc and lvisei May 24, 2023 06:46
@pearmini pearmini changed the title feat(chart): throttle chart.render feat(chart): debounce chart.render May 24, 2023
src/api/chart.ts Outdated Show resolved Hide resolved
@pearmini pearmini merged commit 106b807 into v5 May 24, 2023
@pearmini pearmini deleted the feat/throttle-render branch May 24, 2023 09:28
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants