Erick Mahardika
Erick Mahardika

Reputation: 3

How To Create List from StreamBuilder

How to create a list in streambuilder with the following variables

Cant you helpme for this variable to list for make line chart

    class GraphScreen extends StatefulWidget {
  GraphScreen({super.key});

  @override
  State<GraphScreen> createState() => _GraphScreenState();
}

class _GraphScreenState extends State<GraphScreen> {
  late TooltipBehavior _tooltipBehavior;
  late final stream =
      FirebaseDatabase.instance.ref().child('data').onChildAdded;
  
  @override
  void initState() {
    _tooltipBehavior = TooltipBehavior(enable: true);
    super.initState();
  }

  Widget build(BuildContext context) {
    return Container(
      child: StreamBuilder(
        stream: stream,
        builder: (context, snapshot) {
          if (snapshot.hasData) {
            final data = snapshot.data?.snapshot.value as Map?;
            if (data == null) {
              return Text('No data');
            }

//how create from this variable to list 
 
            final sensorEc = data['EC'];
            final sensorPh = data['PH'];
            final sensorRtd = data['RTD'];
            final humidity = data['humidity'];
            final temperature = data['temperature'];
            final timeStamp = data['Ts'];
            final DateTime timeSTamp =
                DateTime.fromMillisecondsSinceEpoch(timeStamp); 

            return SafeArea(
              child: SfCartesianChart(
                zoomPanBehavior: ZoomPanBehavior(
                  enablePanning: true,
                  enablePinching: true,
                  enableDoubleTapZooming: true,
                  enableMouseWheelZooming: true,
                  maximumZoomLevel: 0.5,
                ),
                plotAreaBorderWidth: 0,
                primaryXAxis: DateTimeAxis(
                  intervalType: DateTimeIntervalType.days,
                  dateFormat: DateFormat.yMMMd(),
                  interval: 1,
                  majorGridLines: const MajorGridLines(width: 0),
                ),
                primaryYAxis: NumericAxis(
                  axisLine: const AxisLine(width: 0),
                  majorTickLines: const MajorTickLines(width: 0),
                ),
                legend: Legend(
                  isVisible: true,
                  position: LegendPosition.bottom,
                ),
                series: <LineSeries<dynamic, DateTime>>[
                  LineSeries<List, DateTime>(
                    name: 'EC',
                    legendIconType: LegendIconType.circle,
                    dataSource: items,
                    xValueMapper: timeSTamp,
                    yValueMapper: sensorEc,
                  ),
                ],
              ),
            );
          }
          if (snapshot.hasError) {
            print(snapshot.error.toString());
            return Text(snapshot.error.toString());
          }
          return Text('....');
        },
      ),
    );
  }
}

from that code to list for make Line Chart I used syncfusion_flutter_charts library but its not working and its only showing y axis point but not x axis points any one can help me the display json data in flutter SfCartesianChart Or help me in put this data in other charts of flutter

Upvotes: 0

Views: 25

Answers (0)

Related Questions