如何使用 flutter 在 FL Chart 中绘制标签

Question

我正在尝试将 FL Chart 与 Flutter 一起使用。

https://pub.dev/packages/fl_chart

我想在内部情节上贴上标签。

现在图片是左侧。

有什么好的样本或文档吗？只有我能找到的是API文档。实施起来很困难。

谢谢。

Answer 1

希望我回答这个问题还不算太晚。但无论谁正在寻找答案，这都是我最近发现的：

在 内部，您可以在lineTouchDataLineChartData属性中根据需要自定义工具提示。下面是我用来在图表中自定义工具提示信息的代码片段。

在 内LineTouchData，touchToolTipData要使用的内容可能会有所不同，具体取决于您正在绘制的图表类型。就我而言，我正在绘制折线图，​​因此我使用的类是LineTouchTootipData. 您可能需要检查哪个类适合您要绘制的图表。

图表示例：

LineChartData(
  ...
  lineTouchData: LineTouchData(
      touchTooltipData: LineTouchTooltipData(
        getTooltipItems: (value) {
          return value
              .map((e) => LineTooltipItem(
                  "${e.y < 0 ? 'Expense:' : 'Income:'} ${e.y.toStringAsFixed(2)} \n Diff: ",
                  TextSetting.text14))
              .toList();
        },
        tooltipBgColor: AppColour.mainBlue,
      )
  ...

)

您可以尝试查看此示例代码，以获得更全面的图表上下文。

https://github.com/imaNNeoFighT/fl_chart/blob/master/example/lib/line_chart/samples/line_chart_sample5.dart