antvis/G2

V4版本柱状图隐藏坐标轴,并且移除坐标轴两侧的留白,第一个柱子和最后一个柱子的宽度会变小 #6234

xiaoke-1 posted onGitHub

问题描述

1.隐藏柱状图的坐标轴 2.溢出坐标轴两侧的留白 柱状图的第一个柱子和最后一个柱子的宽度会变小,应该是以柱状图的第一个柱子作为绘图区域的起点,导致柱子有一半内容溢出绘图区域

重现链接

https://codesandbox.io/p/sandbox/wild-shape-yr4hql?file=%2Fpackage.json%3A5%2C23

重现步骤

No response

预期行为

No response

平台

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

屏幕截图或视频(可选)

No response

补充说明(可选)

No response


V4 这个问题应该没有办法解决,V4 用的比例尺不能调节两侧条外侧的距离。V5 的比例尺支持该能力,参考下面的例子:

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

const data = [
  { letter: 'A', frequency: 0.08167 },
  { letter: 'B', frequency: 0.01492 },
  { letter: 'C', frequency: 0.02782 },
  { letter: 'D', frequency: 0.04253 },
  { letter: 'E', frequency: 0.12702 },
  { letter: 'F', frequency: 0.02288 },
];

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

chart
  .interval()
  .data(data)
  .encode('x', 'letter')
  .encode('y', 'frequency')
  .scale('x', { paddingInner: 0.1, paddingOute: 0 });

chart.render();
posted by pearmini 11 months ago

Fund this Issue

$0.00
Funded

Pull requests