Flutter实战-折线图(fl_chart)

import 'package:fl_chart/fl_chart.dart';
import 'package:flutter/material.dart';
 
class LineChartSample extends StatefulWidget {
  @override
  _LineChartSampleState createState() => _LineChartSampleState();
}
 
class _LineChartSampleState extends State<LineChartSample> {
  List<LineChartBarData> bars;
 
  @override
  void initState() {
    super.initState();
    bars = [
      LineChartBarData(
        spots: [
          FlSpot(1, 1),
          FlSpot(3, 1.5),
          FlSpot(5, 1.4),
          FlSpot(7, 1.6),
          FlSpot(9, 1.7),
          FlSpot(11, 2),
          FlSpot(13, 2.2),
        ],
        isCurved: true,
        colors: [Colors.blue],
        barWidth: 2,
        isStrokeCapRound: true,
        dotData: FlDotData(
          show: false,
        ),
        belowBarData: BarAreaData(
          show: true,
          colors: [
            Colors.blue.shade100,
          ],
        ),
      ),
    ];
  }
 
  @override
  Widget build(BuildContext context) {
    return LineChart(
      LineChartData(
        lineBarsData: bars,
        gridData: FlGridData(
          show: true,
        ),
        titlesData: FlTitlesData(
          bottomTitles: SideTitles(
            showTitles: true,
            reservedSize: 20,
            textStyle: TextStyle(
              color: Colors.black,
              fontSize: 16,
              fontWeight: FontWeight.bold,
            ),
            getTitles: (double value) {
              return '';
            },
          ),
          leftTitles: SideTitles(
            showTitles: true,
            reservedSize: 20,
            textStyle: TextStyle(
              color: Colors.black,
              fontSize: 16,
              fontWeight: FontWeight.bold,
            ),
            getTitles: (double value) {
              return '';
            },
          ),
        ),
        minX: 0,
        maxX: 14,
        minY: 0,
        maxY: 3,
        lineTouchData: LineTouchData(
          enabled: true,
        ),
        lineBarsData: bars,
      ),
    );
  }
}

这段代码演示了如何在Flutter应用程序中使用fl_chart包创建一个折线图。在initState方法中，我们初始化了一个LineChartBarData列表，它包含了一些数据点。在build方