syncfusion_flutter_charts не предоставляет все мои данные

Я пытаюсь использовать этот пакет диаграмм и извлекать данные из firebase, данные добавляются пользователем, например, если Алекс добавил 300, а затем добавил 400, я добавлю в firebase буксировку другой документ: один на 300 и один на 400, как на этой фотографии. все эти документы для одного пользователя

Итак, я хочу получить все значения и даты из всего документа для каждого пользователя и предоставить диаграмму с этим информационным примечанием: мое приложение связывает пожилого пользователя с его наблюдателем, пожилой пользователь добавит свое значение глюкозы из своего дома и диаграммы будет отображаться в доме наблюдателя, это мой код, который работает правильно, но у меня есть только один столбец в моей диаграмме. Я попытался распечатать длину списка, и он дал мне 4, что равно количеству документов.

        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: (context, snapshot) {
          if (snapshot.data == null) {
            return Center(
              child: CircularProgressIndicator(),
            );
          }
          final doc = snapshot.data.docs;
          return ListView.builder(
              itemCount: 1,
              itemBuilder: (ctx, index) {
                List<ChartData> chartData = <ChartData>[];
                for (int i = 1; i <= doc.length; i++) {
                  chartData.add(
                      ChartData(doc[index]['date'], doc[index]['glucose']));
                }
                print(chartData.length);
                return Container(
                  child: Column(
                    children: [
                      Text(
                        "رسم بياني لمستويات الضغط خلال اسبوع",
                        style: textStyle2,
                      ),
                      Directionality(
                        textDirection: TextDirection.ltr,
                        child: SfCartesianChart(
                            plotAreaBorderWidth: 0,
                            margin: EdgeInsets.all(10),
                            primaryXAxis: CategoryAxis(
                              maximumLabelWidth: 80,
                            ),
                            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,
                              )
                            ]),
                      ),
                    ],
                  ),
                );
              });
        }));

}}

      class ChartData {
  ChartData(this.xValue, this.yValue);
  String xValue;
  double yValue;
}

вот мой результат, который дает мне только информацию о первом документе, пожалуйста, если кто-нибудь может дать мне решение

3 ответа

Решение

Думаю, вам нужно что-то вроде этого:

      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;
}

Я также пользуюсь Syncfusion_charts здесь.

Ошибка в основном связана с вашим xValue, потому что они на самом деле и в вашей диаграмме вы классифицируете их как CategoryAxis. Так как они одинаковы, получается только одно значение.

Одно из решений могло быть таким:

Обновите серверную часть Firebase, чтобы она могла Stringв вашем документе. Чтобы обновить свой xValue, чтобы он мог быть DateTime.

      class ChartData {
  ChartData(this.xValue, this.yValue);
  DateTime xValue;
  double yValue;
}

Затем используйте DateTimeAxis или DateTimeCategoryAxis для вашего primaryXAxis в вашем графике.

Привет от Syncfusion. Мы проанализировали ваш сценарий и подготовили образец для справки, воспользуйтесь им. Здесь нам было дано одно и то же строковое значение для оси x, и столбец отображается правильно для данных значений. Мы подозреваем, что у вас есть только одни данные в вашем случае и, следовательно, только один столбец в выходных данных. В нашем прилагаемом образце столбец отображается правильно для заданных данных. Мы также приложили образец для использования с типом timestamp в firebase, и он преобразован в DateTime в нашей диаграмме. Мы надеемся, что приведенные образцы помогут вам, но все же у вас есть проблемы. Верните нам сценарий проблемы, воспроизведенный в прилагаемом образце, который поможет нам провести дальнейший анализ и быстрее предоставить вам решение.

Для получения дополнительной информации см. Справочный документ.

category_sample

datetime_sample

Спасибо, Дхаранитаран. п

Другие вопросы по тегам