【v5】柱线混合，前一个 mark 的 dodgeX tranform 会影响后一个的 Mark #5250

问题描述

线图在分组柱形后面，配置 color 映射。作图失败 <img width="1069" alt="image" src="https://github.com/antvis/G2/assets/1549118/358ab722-83f2-4148-a842-40e6daaa0eb6">

对调代码后，渲染正常 <img width="1106" alt="image" src="https://github.com/antvis/G2/assets/1549118/1ee2d389-d0c2-4b54-a4b4-4749c3dad4e1">

对调后虽然可以渲染，但柱图遮住了线图不符合要求

期望结果

tranfrom 应该只影响对应的 mark。

如何重现

官方代码修改

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: 2, people: 1, type: 'b' },
  { time: '10:40', call: 13, waiting: 1, people: 2, type: 'a' },
  { time: '10:40', call: 13, waiting: 1, people: 2, type: 'b' },
];

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

chart.data(data);

chart
  .interval()
  .transform({ "type": "dodgeX" })
  .encode('x', 'time')
  .encode('y', 'waiting')
  .encode('color', 'type')
  .axis('y', { title: 'Waiting', style: { titleFill: '#5B8FF9' } });

chart
  .line()
  .encode('x', 'time')
  .encode('y', 'people')
  .encode('shape', 'smooth')
  // 多系列
  // .encode('color', 'type')
  // 默认图例
  // .encode('color', () => 'people');

chart.render();

额外信息

• G2 5.0.14 版本