@@ -33,20 +33,17 @@ class _MyHomePageState extends State<MyHomePage> {
3333
3434 @override
3535 void initState () {
36- loadSalesData ();
3736 super .initState ();
3837 }
3938
4039 Future loadSalesData () async {
41- String jsonString = await getJsonFromFirebaseRestAPI ();
42- final jsonResponse = json.decode (jsonString);
43- setState (() {
40+ String jsonString = await getJsonFromFirebase ();
41+ final dynamic jsonResponse = json.decode (jsonString);
4442 for (Map <String , dynamic > i in jsonResponse)
4543 chartData.add (SalesData .fromJson (i));
46- });
4744 }
4845
49- Future <String > getJsonFromFirebaseRestAPI () async {
46+ Future <String > getJsonFromFirebase () async {
5047 String url = "https://flutterdemo-f6d47.firebaseio.com/chartSalesData.json" ;
5148 http.Response response = await http.get (Uri .parse (url));
5249 return response.body;
@@ -55,50 +52,58 @@ class _MyHomePageState extends State<MyHomePage> {
5552 @override
5653 Widget build (BuildContext context) {
5754 return Scaffold (
58- appBar: AppBar (
59- title: const Text ('Syncfusion Flutter chart' ),
60- ),
61- body: Center (
62- child: chartData.isNotEmpty
63- ? SfCartesianChart (
64- primaryXAxis: CategoryAxis (),
65- // Chart title
66- title: ChartTitle (text: 'Half yearly sales analysis' ),
67- series: < ChartSeries <SalesData , String >> [
68- LineSeries <SalesData , String >(
69- dataSource: chartData,
70- xValueMapper: (SalesData sales, _) => sales.month,
71- yValueMapper: (SalesData sales, _) => sales.sales,
72- // Enable data label
73- dataLabelSettings: DataLabelSettings (isVisible: true ))
74- ])
75- : Card (
76- elevation: 5.0 ,
77- child: Container (
78- height: 100 ,
79- width: 400 ,
80- child: Center (
81- child: Row (
82- mainAxisAlignment: MainAxisAlignment .spaceAround,
83- children: [
84- Text ('Retriving Firebase data...' ,
85- style: TextStyle (fontSize: 20.0 )),
86- Container (
87- height: 40 ,
88- width: 40 ,
89- child: CircularProgressIndicator (
90- semanticsLabel: 'Retriving Firebase data' ,
91- valueColor: AlwaysStoppedAnimation <Color >(
92- Colors .blueAccent),
93- backgroundColor: Colors .grey[300 ],
55+ appBar: AppBar (
56+ title: const Text ('Syncfusion Flutter chart' ),
57+ ),
58+ body: Center (
59+ child: FutureBuilder (
60+ future: getJsonFromFirebase (),
61+ builder: (context, snapShot) {
62+ loadSalesData ();
63+ if (snapShot.hasData) {
64+ return SfCartesianChart (
65+ primaryXAxis: CategoryAxis (),
66+ // Chart title
67+ title: ChartTitle (text: 'Half yearly sales analysis' ),
68+ series: < ChartSeries <SalesData , String >> [
69+ LineSeries <SalesData , String >(
70+ dataSource: chartData,
71+ xValueMapper: (SalesData sales, _) => sales.month,
72+ yValueMapper: (SalesData sales, _) => sales.sales,
73+ // Enable data label
74+ dataLabelSettings:
75+ DataLabelSettings (isVisible: true ))
76+ ]);
77+ } else {
78+ return Card (
79+ elevation: 5.0 ,
80+ child: Container (
81+ height: 100 ,
82+ width: 400 ,
83+ child: Center (
84+ child: Row (
85+ mainAxisAlignment: MainAxisAlignment .spaceAround,
86+ children: [
87+ Text ('Retriving Firebase data...' ,
88+ style: TextStyle (fontSize: 20.0 )),
89+ Container (
90+ height: 40 ,
91+ width: 40 ,
92+ child: CircularProgressIndicator (
93+ semanticsLabel: 'Retriving Firebase data' ,
94+ valueColor: AlwaysStoppedAnimation <Color >(
95+ Colors .blueAccent),
96+ backgroundColor: Colors .grey[300 ],
97+ ),
9498 ),
95- ) ,
96- ] ,
99+ ] ,
100+ ) ,
97101 ),
98102 ),
99- ),
100- )),
101- );
103+ );
104+ }
105+ }),
106+ ));
102107 }
103108}
104109
0 commit comments