答疑labelAutoHide使用

[Calmio-Y]

问题描述

目标想要x轴刻度值不隐藏
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 },
{ letter: 'G', frequency: 0.02015 },
{ letter: 'H', frequency: 0.06094 },
{ letter: 'I', frequency: 0.06966 },
{ letter: 'J', frequency: 0.00153 },
{ letter: 'K', frequency: 0.00772 },
{ letter: 'L', frequency: 0.04025 },
{ letter: 'M', frequency: 0.02406 },
{ letter: 'N', frequency: 0.06749 },
{ letter: 'O', frequency: 0.07507 },
{ letter: 'P', frequency: 0.01929 },
{ letter: 'Q', frequency: 0.00095 },
{ letter: 'R', frequency: 0.05987 },
{ letter: 'S', frequency: 0.06327 },
{ letter: 'T', frequency: 0.09056 },
{ letter: 'U', frequency: 0.02758 },
{ letter: 'V', frequency: 0.00978 },
{ letter: 'W', frequency: 0.0236 },
{ letter: 'X', frequency: 0.0015 },
{ letter: 'Y', frequency: 0.01974 },
{ letter: 'Z', frequency: 0.00074 },
];
const chart = new Chart({
container: 'container',
autoFit: true,
height:200,
width:400
});

chart
.interval()
.data(data)
.encode('x', 'letter')
.encode('y', 'frequency')
.axis('x',{
// labelDirection:'negative',
labelFontSize:28,
labelAutoHide:false,
labelAutoEllipsis:false,
labelAutoWrap:false,
labelAutoWrap:false
// labelAutoRotate:false
})

chart.render();

重现链接

No response

重现步骤

1. 打开demo,复制上述代码
2. 参考截图红框

预期行为

想要全部显示x轴的刻度

平台

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

屏幕截图或视频（可选）

No response

补充说明（可选）

No response

[hustcc]

labelAuto 的策略 需要配合 size 使用才能生效。

{
  size: 100,
}

[Calmio-Y]

有demo吗

[hustcc]

有demo吗

直接在你的 demo 代码中加上 size: 100 就能生效。

[Calmio-Y]

size给多少才能看起来和正常的显示一致。我尝试了多个size都不行

[hustcc]

你说的正常显示是什么？不重叠吗？

[Calmio-Y]

[Calmio-Y]

不重叠且不自动缩略

[hustcc]

做不到吧，不重叠，还不能省略，空间也不够用啊~

[Calmio-Y]

现在会有一种现象

肉眼感觉能感觉能放下。但是又自动缩略了

[hustcc]

可能就差那么一点点，毕竟是数学计算，你拖宽一点试试看。