1
1
import 'dart:convert' ;
2
- import 'dart:async' show Future;
3
2
4
3
import 'package:flutter/material.dart' ;
5
- import 'package:flutter/services .dart' show rootBundle ;
4
+ import 'package:flutter/rendering .dart' ;
6
5
import 'package:syncfusion_flutter_charts/charts.dart' ;
7
- import 'package:syncfusion_flutter_core/core .dart' ;
6
+ import 'package:http/http .dart' as http ;
8
7
9
8
void main () {
10
- // Register your license here
11
- SyncfusionLicense .registerLicense ('ADD YOUR LICENSE KEY HERE' );
12
9
return runApp (ChartApp ());
13
10
}
14
11
@@ -25,7 +22,7 @@ class ChartApp extends StatelessWidget {
25
22
26
23
class MyHomePage extends StatefulWidget {
27
24
// ignore: prefer_const_constructors_in_immutables
28
- MyHomePage ({Key key}) : super (key: key);
25
+ MyHomePage ({Key ? key}) : super (key: key);
29
26
30
27
@override
31
28
_MyHomePageState createState () => _MyHomePageState ();
@@ -34,24 +31,23 @@ class MyHomePage extends StatefulWidget {
34
31
class _MyHomePageState extends State <MyHomePage > {
35
32
List <SalesData > chartData = [];
36
33
37
- Future <String > _loadSalesDataAsset () async {
38
- return await rootBundle.loadString ('assets/data.json' );
34
+ @override
35
+ void initState () {
36
+ loadSalesData ();
37
+ super .initState ();
39
38
}
40
39
41
40
Future loadSalesData () async {
42
- String jsonString = await _loadSalesDataAsset ();
43
- final jsonResponse = json.decode (jsonString);
44
- setState (() {
45
- for (Map i in jsonResponse) {
46
- chartData.add (SalesData .fromJson (i));
47
- }
48
- });
41
+ final String jsonString = await getJsonFromFirebase ();
42
+ final dynamic jsonResponse = json.decode (jsonString);
43
+ for (Map <String , dynamic > i in jsonResponse)
44
+ chartData.add (SalesData .fromJson (i));
49
45
}
50
-
51
- @override
52
- void initState () {
53
- super . initState ( );
54
- loadSalesData () ;
46
+
47
+ Future < String > getJsonFromFirebase () async {
48
+ String url = "https://flutterdemo-f6d47.firebaseio.com/chartSalesData.json" ;
49
+ http. Response response = await http. get ( Uri . parse (url) );
50
+ return response.body ;
55
51
}
56
52
57
53
@override
@@ -60,35 +56,67 @@ class _MyHomePageState extends State<MyHomePage> {
60
56
appBar: AppBar (
61
57
title: const Text ('Syncfusion Flutter chart' ),
62
58
),
63
- body: SfCartesianChart (
64
- primaryXAxis: CategoryAxis (),
65
- // Chart title
66
- title: ChartTitle (text: 'Half yearly sales analysis' ),
67
- // Enable legend
68
- legend: Legend (isVisible: true ),
69
- // Enable tooltip
70
- tooltipBehavior: TooltipBehavior (enable: true ),
71
- series: < ChartSeries <SalesData , String >> [
72
- LineSeries <SalesData , String >(
73
- dataSource: chartData,
74
- xValueMapper: (SalesData sales, _) => sales.year,
75
- yValueMapper: (SalesData sales, _) => sales.sales,
76
- // Enable data label
77
- dataLabelSettings: DataLabelSettings (isVisible: true ))
78
- ]));
59
+ body: Center (
60
+ child: FutureBuilder (
61
+ future: getJsonFromFirebase (),
62
+ builder: (context, snapShot) {
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
+ ),
98
+ ),
99
+ ],
100
+ ),
101
+ ),
102
+ ),
103
+ );
104
+ }
105
+ }),
106
+ ));
79
107
}
80
108
}
81
109
82
110
class SalesData {
83
- SalesData (this .year , this .sales);
111
+ SalesData (this .month , this .sales);
84
112
85
- final String year ;
86
- final double sales;
113
+ final String month ;
114
+ final int sales;
87
115
88
116
factory SalesData .fromJson (Map <String , dynamic > parsedJson) {
89
117
return SalesData (
90
- parsedJson['year ' ].toString (),
91
- parsedJson['sales' ] as double ,
118
+ parsedJson['month ' ].toString (),
119
+ parsedJson['sales' ],
92
120
);
93
121
}
94
- }
122
+ }
0 commit comments