dart - charts_flutter - 如何设置 x 轴刻度的间隔

Question

我正在使用以下代码片段绘制一些实时时间序列折线图:

  new SizedBox(
    height: MediaQuery.of(context).size.height / 4,
    child: new charts.TimeSeriesChart([
      new charts.Series<HistoryData, DateTime>(
          id: 'test',
          colorFn: (_, __) => colourArray[dataArrayName],
          data: dataArray,
          domainFn: (HistoryData sales, _) => sales.date,
          measureFn: (HistoryData sales, _) => sales.historyValue)
    ],
        animate: true,
        dateTimeFactory: const charts.LocalDateTimeFactory()),
  )

class HistoryData {
  final DateTime date;
  final double historyValue;

  HistoryData(this.date, this.historyValue);
}

数据显示正常，但我注意到只有一个 x 轴标签:

我想知道是否有人可以帮我弄清楚如何制作它以便在 x 轴上有许多均匀间隔的刻度。

谢谢

编辑:dataArray是 List<HistoryData> 类型的变量

这是打印品:

I/flutter (19864): [Instance of 'HistoryData', Instance of 'HistoryData', Instance of 'HistoryData', Instance of 'HistoryData', Instance of 'HistoryData', Instance of 'HistoryData', Instance of 'HistoryData', Instance of 'HistoryData', Instance of 'HistoryData', Instance of 'HistoryData', Instance of 'HistoryData', Instance of 'HistoryData', Instance of 'HistoryData', Instance of 'HistoryData', Instance of 'HistoryData', Instance of 'HistoryData', Instance of 'HistoryData', Instance of 'HistoryData', Instance of 'HistoryData', Instance of 'HistoryData', Instance of 'HistoryData', Instance of 'HistoryData', Instance of 'HistoryData', Instance of 'HistoryData', Instance of 'HistoryData', Instance of 'HistoryData', Instance of 'HistoryData', Instance of 'HistoryData', Instance of 'HistoryData', Instance of 'HistoryData', Instance of 'HistoryData', Instance of 'HistoryData', Instance of 'HistoryData', Instance of 'HistoryData', Instance of 'HistoryData', Instance of 'HistoryData', Instance of 'HistoryData', Instance of 'HistoryDat...

有 60 个 HistoryData此 List 中的对象每个 date每个值 HistoryData彼此相隔2秒。

Answer 1

charts.TimeSeriesChart(
    _createSampleData(),
    animate: true,
    domainAxis: new charts.DateTimeAxisSpec(
      tickProviderSpec: charts.DayTickProviderSpec(increments: [1]),
      tickFormatterSpec: new charts.AutoDateTimeTickFormatterSpec(
        day: new charts.TimeFormatterSpec(
            format: 'EEE', transitionFormat: 'EEE', noonFormat: 'EEE'),
      ),
      showAxisLine: false,
    ),
  ),

此行设置您希望在域或底轴上显示多少刻度

tickProviderSpec: charts.DayTickProviderSpec(increments: [1]),

将增量更改为 2 和 3 并检查输出