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

【v5】分组柱形 changeData 图例更新出错 #5215

Closed
Deathsteps opened this issue Jun 21, 2023 · 0 comments · Fixed by #5258
Closed

【v5】分组柱形 changeData 图例更新出错 #5215

Deathsteps opened this issue Jun 21, 2023 · 0 comments · Fixed by #5258
Labels

Comments

@Deathsteps
Copy link
Contributor

问题描述

初始数据效果,type=a 的数据都是矮的
image

数据排序后,调用 changeData,图例错误,type=b 成了矮的
image

期望结果

changeData 后,图例能准确更新

如何重现

官方代码修改

import { Chart } from '@antv/g2';

const data = [
  { time: '10:10', call: 4, waiting: 2, people: 2, type: 'a' },
  { time: '10:10', call: 2, waiting: 6, people: 3, type: 'b' },
  { time: '10:20', call: 13, waiting: 2, people: 5, type: 'a' },
  { time: '10:20', call: 9, waiting: 9, people: 1, type: 'b' },
  { time: '10:30', call: 5, waiting: 2, people: 3, type: 'a' },
  { time: '10:30', call: 8, waiting: 5, people: 1, type: 'b' },
  { time: '10:40', call: 13, waiting: 1, people: 2, type: 'a' },
  { time: '10:40', call: 13, waiting: 3, people: 2, type: 'b' },
];

const chart = new Chart({
  container: 'container',
  theme: 'classic',
  autoFit: true,
});

chart.data(data);

setTimeout(() => {
  data.sort((x, y) => x.type > y.type ? -1 : 1);
  console.log(data);
  chart.changeData(data);
}, 5000);

chart
  .interval()
  .transform({ type: 'dodgeX' })
  .encode('x', 'time')
  .encode('y', 'waiting')
  .encode('color', 'type')
  .label({ text: 'waiting' });

chart.render();

额外信息

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants