React-Apexcharts 如何在一个范围内逐步通过 x 轴

Question

我是 Apexcharts 的新手，我正致力于实现折线图。我在尝试应用长度较长的数组（与长度大于 500 的数组一样大）时遇到了有关图表 x 轴的问题。 x轴的单位是以时间为单位，格式为"mm:ss"，数组中的时间戳转换为"mm:ss"后，由于精度的原因具有相同的值。例如时间戳数组中，有两个值"2021-02-16T22:47:30.369704+00:00"和"2021-02-16T22:47:30.119704+00:00"，这两个值都是"47:30"，转换成"mm:ss"的格式。在这种情况下，我的 x 轴值看起来像 "47:29", "47:30", "47:30", "47:30", "47, 31" 有重复项。我直接将保存转换后的时间戳的数组传递给 apexcharts 的 xaxis 配置，如下所示：

  // This array is not hardcoded like below, this is for elaborate purpose
  // In order to get the values in the array, I made a network request which returned to big
  // amount of data requires me to plot in to the line chart
  cosnt arrayOfMinutesSec = ["00:00", "00:01", "00:01", "00:01", "00:02", "00:02", "00:02", 
                             ...., "04:00"];
  const options = {
    ...
    xaxis: {
      categories: arrayOfMinutesSec,
      crosshairs: {
        show: true
      }
    }
    ...
  }

有没有办法告诉图形在一个范围内逐步显示而不是显示数组中的每个元素？所以类似于每 5 秒步进 "00:00", "00:05", "00:10", ..., "03:55", "4:00"

非常感谢任何形式的帮助。

Answer 1

我刚刚弄明白了。 options配置的xaxis属性里面有一个tickAmount属性，可以让你把xaxis除以你传入的值

React-Apexcharts 如何在一个范围内逐步通过 x 轴

React-Apexcharts how to step through the x-axis within a range

javascript

reactjs

apexcharts