使用vchart图表库时x轴数据重叠和y轴数据不显示的问题

用户60682114007
235 阅读1分钟

问题标题

使用vchart图表库时x轴数据重叠和y轴数据不显示的问题

问题描述

我在使用vchart图表库制作柱状图的时候遇到问题。无论我在模拟器还是真机上测试，x轴（下轴）的数据会出现重叠的情况。

此外，我还注意到有一些柱状图的顶部标签会被挪到柱子内部，这是正常的吗？

解决方案

有以下解决方案：

对于x轴数据重叠的问题，这是因为关闭了sampling设置。原来是希望x轴的所有数据都能展示出来，结果导致了数据重叠的情况。可以使用滚动条来解决这个问题，为图表添加如下配置：

scrollBar: [ { orient: 'bottom', start: 0, end: 0.5, roam: true } ]

对于柱状图顶部标签被挪到柱子内部的问题，这是因为防止标签相互重叠，系统自动进行了调整。可以通过设置标签配置overlap为false来关闭该功能：

label: {overlap: false}

结果展示

在线demo：codesandbox.io/p/sandbox/l…

相关文档

avatar
文章
阅读
粉丝