Flutter：在 Syncfusion CartesianChart 中显示“无数据”消息

Posted 2023-05-07

【中文标题】Flutter：在 Syncfusion CartesianChart 中显示“无数据”消息

【英文标题】：Flutter: Show "No Data" message in Syncfusion CartesianChart

【发布时间】：2021-07-21 21:42:21

【问题描述】：

我正在使用 Flutter 的 syncfusion 库，当我有数据时可以构建折线图。但是，如果列表为空，它只会绘制轴，仅此而已。尽管这是意料之中的，但我想在图表中心写一条“无数据”消息。

这是我的图表小部件：

             SfCartesianChart(
                margin: EdgeInsets.all(0),
                borderWidth: 0,
                plotAreaBorderWidth: 0,
                title: ChartTitle(text: 'Mood Tracks', textStyle: TextStyle(fontWeight: FontWeight.bold)),
                tooltipBehavior: _tooltipBehavior,
                series: <ChartSeries>[
                  LineSeries<MoodRecord, dynamic>(
                      name: 'Moods',
                      color: Colors.green[400],
                      dataSource: [],
                      xValueMapper: (MoodRecord record, _) => record.date,
                      yValueMapper: (MoodRecord record, _) => record.mood.toInt(),
                      dataLabelSettings: DataLabelSettings(isVisible: true),
                      enableTooltip: true)
                ],
                primaryXAxis: CategoryAxis(
                  labelPlacement: LabelPlacement.onTicks,
                  labelStyle: TextStyle(fontWeight: FontWeight.bold)
                ),
                primaryYAxis: NumericAxis(
                  labelFormat: 'value%',
                  labelStyle: TextStyle(fontWeight: FontWeight.bold)
                ),
              ),

有没有办法显示这样的信息？

【参考方案1】：

我们查看了这个问题，想告诉您，我们可以通过使用图表的 annotations 属性来满足要求。如果数据源为空，我们可以将 Text Widget 定位为“No Data”，否则，我们可以将空容器分配给注解。使用这些注释，我们可以将必要的小部件放置在地图中所需的位置，有关更多详细信息，请参阅support document，我们已附上示例作为参考。

示例：https://www.syncfusion.com/downloads/support/directtrac/326033/ze/I326033_no_data_text48946494