Flutter 带有扩展小部件的饼图

Question

please see my code

I'm trying to put a pie chart from chart_flutter in Expanded Widget but have error "incorrect use of parent widget" I tried to wrap the parent Column with a container and give it a fixed height and width, remove the list view Widget, wrap the chart with a container, but no luck Please need help with this, keeping in mind that I have in this screen a data table so after the table occupying the required space I need the chart take the rest. Thanks in advance.

Answer 1

here is a little example for what i have suggested for you using syncfusion_flutter_charts and FireStore :

Widget build(BuildContext context) {
    Future getElderlyId() async {
      await FirebaseFirestore.instance
          .collection('users')
          .doc(FirebaseAuth.instance.currentUser.uid)
          .get()
          .then((data) {
        setState(() {
          elderlyId = data.data()['elderlyId'];
        });
      });
    }

    return Scaffold(
        body: StreamBuilder(
            stream: FirebaseFirestore.instance
                .collection('glucose')
                .where('uid', isEqualTo: elderlyId)
                .snapshots(),
            builder:
                (BuildContext context, AsyncSnapshot<QuerySnapshot> snapshot) {
              if (snapshot.hasData) {
                // return Center(
                //   child: CircularProgressIndicator(),
                // );

                List<ChartData> chartData = [];
                for (int index = 0;
                    index < snapshot.data.docs.length;
                    index++) {
                  DocumentSnapshot documentSnapshot = snapshot.data.docs[index];
                  chartData.add(ChartData.fromMap(documentSnapshot.data()));
                }

                return Container(
                  child: Column(
                    children: [
                      Text(
                        "رسم بياني لمستويات السكر خلال اسبوع",
                        style: textStyle2,
                      ),
                      Directionality(
                        textDirection: TextDirection.ltr,
                        child: SfCartesianChart(
                            plotAreaBorderWidth: 0,
                            margin: EdgeInsets.all(10),
                            // primaryXAxis: CategoryAxis(
                            //   maximumLabelWidth: 80,
                            // ),
                            primaryXAxis: DateTimeAxis(
                                // Interval type will be months
                                intervalType: DateTimeIntervalType.days,
                                interval: 1),
                            primaryYAxis: CategoryAxis(
                              maximumLabelWidth: 80,
                            ),
                            enableAxisAnimation: true,
                            // borderColor: yellow,
                            series: <CartesianSeries<ChartData, dynamic>>[
                              ColumnSeries<ChartData, dynamic>(
                                color: yellow,
                                dataSource: chartData,
                                xAxisName: "days",
                                yAxisName: "values",
                                // color: yellow,
                                animationDuration: 20,
                                xValueMapper: (ChartData gelu, _) =>
                                    gelu.xValue,
                                yValueMapper: (ChartData gelu, _) =>
                                    gelu.yValue,
                              )
                            ]),
                      ),
                    ],
                  ),
                );
              } else {
                return CircularProgressIndicator();
              }
            }));
  }
}

class ChartData {
  ChartData(this.xValue, this.yValue);
  ChartData.fromMap(Map<String, dynamic> dataMap)
      : xValue = dataMap['date'],
        yValue = dataMap['glucose'];
  Timestamp xValue;
  double yValue;
}