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

问题描述

初始数据效果，type=a 的数据都是矮的 <img width="1053" alt="image" src="https://github.com/antvis/G2/assets/1549118/03cc7fbc-20c4-4d05-ac27-86838871f365">

数据排序后，调用 changeData，图例错误，type=b 成了矮的 <img width="1051" alt="image" src="https://github.com/antvis/G2/assets/1549118/4ca31594-6c35-4fc4-b40d-115bb8950884">

期望结果

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();

额外信息

• G2 5.0.12 版本
• 可能相关的 issue #4939