paddingOuter 设置为绝对值 px #5979

问题描述

想控制两个柱状图之间的距离是固定值，比如 10px，而不是按照百分比会变化的，怎么实现呢。原因是数据多的时候显示正常，少的时候就会变得很大 <img width="992" alt="image" src="https://github.com/antvis/G2/assets/14836228/319afdcc-4ec3-44fa-99f6-f4ec60868239">

<img width="1017" alt="image" src="https://github.com/antvis/G2/assets/14836228/f518f7c4-66e4-4101-a748-0475012c0fda">

重现链接

No response

重现步骤

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

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

const data = [
  { time: '10:10', call: 4, waiting: 2, people: 2 },
  { time: '10:15', call: 2, waiting: 6, people: 3 },
];

chart.data(data);

chart
  .interval()
  .style('maxWidth', 33)
  .encode('x', 'time')
  .encode('y', 'waiting')
  .encode('color', () => 'waiting')
  .encode('series', () => 'waiting')
  .axis('y', { title: 'Waiting' });

chart
  .interval()
  .style('maxWidth', 33)
  .encode('x', 'time')
  .encode('y', 'people')
  .encode('color', () => 'people')
  .encode('series', () => 'people')
  .scale('y', { independent: true })
  .axis('y', { position: 'right', grid: null, title: 'People' });

chart.scale('series', { paddingOuter: 0.8 })
chart.render();

预期行为

No response

平台

• 操作系统: [macOS, Windows, Linux, React Native ...]
• 网页浏览器: [Google Chrome, Safari, Firefox]

屏幕截图或视频（可选）

No response

补充说明（可选）

No response