!!!###!!!title=85- 面积图 x 轴如何隔几个点显示刻度?——VisActor/VChart FAQ 文档!!!###!!!

面积图 x 轴如何隔几个点显示刻度?

问题描述

类似(https://www.visactor.io/vchart/demo/area-chart/null-value-area)这样的面积图里面数据比较多,比如几百条。当某些轴上的标签内容过长时,很容易出现重叠或者视觉过于密集的情况,需要按一定的间隔去展示X轴上的刻度。

这类图表有配置使得坐标轴每隔几个点显示刻度,类似 echarts 的 interval 那种的么?

解决方案

不同图表库的解决方案不一样,根据你给的 demo,在 VChart 中只需要开启轴采样就可以避免坐标轴文字遮挡的问题。

  • sampling 是否开启轴数据采样,默认开启。轴采样开启之后,会对轴数据进行采样显示,防止轴数据的重叠。 如果你还想自定义轴标签之间的间距,通过配置 label.minGap 可以控制轴标签之间的间距。
  • 通过 minGap 可以自定义标签之间的最小间距(单位为像素)。仅当轴采样开始时生效(sampling: true)。 该配置会影响轴采样的结果。

代码示例

结果展示

相关文档