坐标轴刻度的时间区间长度是给定的（一个季度）我怎么能设定比如只显示三个坐标轴刻度么？或者自适应均匀些？

Question

类似 （https://www.visactor.io/vchart/demo/line-chart/multi-line）这样的折线图：

坐标轴时间区间长度给定的情况下，该怎么设置坐标轴刻度的显示数量？例如我想只显示三个坐标轴刻度，或者自适应刻度数量。

Answer 1

解决方案：
在VChart中，共有linear、band、time、log4种坐标轴类型。对于每种坐标轴，只需要设置tick.tickCount=3，或者tick.forceTickCount=3 即可指定坐标轴刻度的数量。

当未指定tickCount时，会采用自适应tick数量，自动寻找能够使所有轴标签都不重叠的最大tick数量。

代码参考：

const spec = {
  type: 'line',
  data: {
    values: latestData,
  },
  xField: 'country',
  yField: 'value',
  seriesField: 'name',
  axes: [
    {
      orient: 'left',
      domainLine: { visible: false },
      tick: { visible: false },
      label: {
        style: {
          fill: 'rgb(162, 162, 162)'
        }
      },
      grid: {
        style: {
          lineDash: [0],
          stroke: 'rgb(231, 231, 231)'
        }
      }
    },
    {
      orient: 'bottom',
      domainLine: { visible: true, style: { stroke: '#000' } },
      tick: {
        style: { stroke: '#000' }
        tickCount: 3,
      }
    }
  ],


};

在线效果参考：
https://codesandbox.io/s/line-chart-tick-count-fxh599?file=/s...

相关文档：

• 折线图教程：https://www.visactor.io/vchart/guide/tutorial_docs/Chart_Type...
• 相关api：https://www.visactor.io/vchart/option/lineChart#axes-linear.t...
• github：https://github.com/VisActor/VChart