From e788f09ed9eae555b94234fde3d374b425dede03 Mon Sep 17 00:00:00 2001 From: "Mirza.Shafique" Date: Mon, 11 Oct 2021 09:29:57 +0300 Subject: [PATCH] Show Chart Widget --- .../my_trackers/Weight/WeightMonthlyPage.dart | 2 + .../my_trackers/Weight/WeightWeeklyPage.dart | 4 +- .../my_trackers/Weight/WeightYeaPage.dart | 3 +- .../medical/vital_sign/LineChartCurved.dart | 5 +- .../vital_sing_chart_and_detials.dart | 4 +- lib/widgets/charts/show_chart.dart | 190 ++++++++---------- 6 files changed, 92 insertions(+), 116 deletions(-) diff --git a/lib/pages/medical/my_trackers/Weight/WeightMonthlyPage.dart b/lib/pages/medical/my_trackers/Weight/WeightMonthlyPage.dart index 05485adf..ff5a707d 100644 --- a/lib/pages/medical/my_trackers/Weight/WeightMonthlyPage.dart +++ b/lib/pages/medical/my_trackers/Weight/WeightMonthlyPage.dart @@ -8,6 +8,7 @@ import 'package:diplomaticquarterapp/uitl/translations_delegate_base.dart'; import 'package:diplomaticquarterapp/uitl/utils.dart'; import 'package:diplomaticquarterapp/uitl/utils_new.dart'; import 'package:diplomaticquarterapp/widgets/charts/app_time_series_chart.dart'; +import 'package:diplomaticquarterapp/widgets/charts/show_chart.dart'; import 'package:diplomaticquarterapp/widgets/data_display/text.dart'; import 'package:diplomaticquarterapp/widgets/others/app_scaffold_widget.dart'; import 'package:flutter/cupertino.dart'; @@ -42,6 +43,7 @@ class WeightMonthlyPage extends StatelessWidget { timeSeries: model.weighMonthTimeSeriesData.isEmpty ? [TimeSeriesSales3(0, 0.0)] : model.weighMonthTimeSeriesData, indexes: model.weighMonthTimeSeriesData.length ~/ 5.5, ), + ), Card( shape: cardRadius(12), diff --git a/lib/pages/medical/my_trackers/Weight/WeightWeeklyPage.dart b/lib/pages/medical/my_trackers/Weight/WeightWeeklyPage.dart index 4ff833b0..d06c0f85 100644 --- a/lib/pages/medical/my_trackers/Weight/WeightWeeklyPage.dart +++ b/lib/pages/medical/my_trackers/Weight/WeightWeeklyPage.dart @@ -7,6 +7,7 @@ import 'package:diplomaticquarterapp/uitl/translations_delegate_base.dart'; import 'package:diplomaticquarterapp/uitl/utils.dart'; import 'package:diplomaticquarterapp/uitl/utils_new.dart'; import 'package:diplomaticquarterapp/widgets/charts/app_time_series_chart.dart'; +import 'package:diplomaticquarterapp/widgets/charts/show_chart.dart'; import 'package:diplomaticquarterapp/widgets/data_display/text.dart'; import 'package:diplomaticquarterapp/widgets/others/app_scaffold_widget.dart'; import 'package:diplomaticquarterapp/widgets/transitions/fade_page.dart'; @@ -44,10 +45,11 @@ class WeightWeeklyPage extends StatelessWidget { shape: cardRadius(12), elevation: 1, margin: EdgeInsets.only(left: 16, top: 16, right: 16, bottom: 8), - child: LineChartCurved( + child: ShowChart( title: TranslationBase.of(context).weight, timeSeries: model.weightWeekTimeSeriesData.isEmpty ? [TimeSeriesSales2(DateTime.now(), 0.0)] : model.weightWeekTimeSeriesData, indexes: model.weightWeekTimeSeriesData.length ~/ 5.5 ?? 0, + horizontalInterval: 2, ), ), Card( diff --git a/lib/pages/medical/my_trackers/Weight/WeightYeaPage.dart b/lib/pages/medical/my_trackers/Weight/WeightYeaPage.dart index 843e438b..efa3393d 100644 --- a/lib/pages/medical/my_trackers/Weight/WeightYeaPage.dart +++ b/lib/pages/medical/my_trackers/Weight/WeightYeaPage.dart @@ -8,6 +8,7 @@ import 'package:diplomaticquarterapp/uitl/translations_delegate_base.dart'; import 'package:diplomaticquarterapp/uitl/utils.dart'; import 'package:diplomaticquarterapp/uitl/utils_new.dart'; import 'package:diplomaticquarterapp/widgets/charts/app_time_series_chart.dart'; +import 'package:diplomaticquarterapp/widgets/charts/show_chart.dart'; import 'package:diplomaticquarterapp/widgets/data_display/text.dart'; import 'package:diplomaticquarterapp/widgets/others/app_scaffold_widget.dart'; import 'package:flutter/cupertino.dart'; @@ -35,7 +36,7 @@ class WeightYearPage extends StatelessWidget { shape: cardRadius(12), elevation: 1, margin: EdgeInsets.only(left: 16, top: 16, right: 16, bottom: 8), - child: LineChartCurved( + child: ShowChart( horizontalInterval: 2.0, title: TranslationBase.of(context).weight, timeSeries: model.weightYearTimeSeriesData.isEmpty ? [TimeSeriesSales2(DateTime.now(), 0.0)] : model.weightYearTimeSeriesData, diff --git a/lib/pages/medical/vital_sign/LineChartCurved.dart b/lib/pages/medical/vital_sign/LineChartCurved.dart index f28c2801..12cfa026 100644 --- a/lib/pages/medical/vital_sign/LineChartCurved.dart +++ b/lib/pages/medical/vital_sign/LineChartCurved.dart @@ -9,8 +9,9 @@ class LineChartCurved extends StatelessWidget { final String title; final List timeSeries; final int indexes; + final double horizontalInterval; - LineChartCurved({this.title, this.timeSeries, this.indexes}); + LineChartCurved({this.title, this.timeSeries, this.indexes, this.horizontalInterval = 20.0}); List xAxixs = List(); List yAxixs = List(); @@ -166,8 +167,6 @@ class LineChartCurved extends StatelessWidget { ); } - - calculateMaxAndMin() { getMaxY(); getMaxX(); diff --git a/lib/pages/medical/vital_sign/vital_sing_chart_and_detials.dart b/lib/pages/medical/vital_sign/vital_sing_chart_and_detials.dart index 6bec6023..ea29909b 100644 --- a/lib/pages/medical/vital_sign/vital_sing_chart_and_detials.dart +++ b/lib/pages/medical/vital_sign/vital_sing_chart_and_detials.dart @@ -5,6 +5,7 @@ import 'package:diplomaticquarterapp/uitl/translations_delegate_base.dart'; import 'package:diplomaticquarterapp/uitl/utils.dart'; import 'package:diplomaticquarterapp/uitl/utils_new.dart'; import 'package:diplomaticquarterapp/widgets/charts/app_time_series_chart.dart'; +import 'package:diplomaticquarterapp/widgets/charts/show_chart.dart'; import 'package:flutter/material.dart'; import 'package:provider/provider.dart'; @@ -52,10 +53,11 @@ class _VitalSingChartAndDetialsState extends State { shape: cardRadius(12), elevation: 1, margin: EdgeInsets.only(left: 16, top: 16, right: 16, bottom: 8), - child: LineChartCurved( + child: ShowChart( title: widget.name, timeSeries: timeSeriesData, indexes: timeSeriesData.length ~/ 5.5, + horizontalInterval: 8, ), ), Card( diff --git a/lib/widgets/charts/show_chart.dart b/lib/widgets/charts/show_chart.dart index ea0a8a9a..15e32a48 100644 --- a/lib/widgets/charts/show_chart.dart +++ b/lib/widgets/charts/show_chart.dart @@ -1,3 +1,4 @@ +import 'package:diplomaticquarterapp/uitl/utils_new.dart'; import 'package:diplomaticquarterapp/widgets/charts/app_time_series_chart.dart'; import 'package:fl_chart/fl_chart.dart'; import 'package:flutter/material.dart'; @@ -10,15 +11,26 @@ class ShowChart extends StatelessWidget { final int indexes; final double horizontalInterval; - ShowChart({this.title, this.timeSeries, this.indexes, this.horizontalInterval = 20.0}); + ShowChart({this.title, this.timeSeries, this.indexes, this.horizontalInterval = 8.0}); List xAxixs = List(); List yAxixs = List(); + double minY = 0; + double maxY = 0; + double intialY = 0; + double lastY = 0; + + double minX = 0; + double maxX = 0; + double increasingY = 0; + @override Widget build(BuildContext context) { getXaxix(); getYaxix(); + getInitialY(); + calculateMaxAndMin(); return AspectRatio( aspectRatio: 1.0, child: Container( @@ -31,17 +43,20 @@ class ShowChart extends StatelessWidget { Column( crossAxisAlignment: CrossAxisAlignment.stretch, children: [ - const SizedBox( - height: 4, - ), - Text( - title, - style: TextStyle(color: Colors.black, fontSize: 16, letterSpacing: -0.64, fontWeight: FontWeight.w600), - textAlign: TextAlign.center, - ), - SizedBox( - height: 10, + Row( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + Padding( + padding: const EdgeInsets.all(16.0), + child: Text( + title, + style: TextStyle(color: Colors.black, fontSize: 16, letterSpacing: -0.64, fontWeight: FontWeight.w600), + textAlign: TextAlign.center, + ), + ), + ], ), + mHeight(10), Expanded( child: Padding( padding: const EdgeInsets.only(right: 18.0, left: 16.0), @@ -72,91 +87,14 @@ class ShowChart extends StatelessWidget { } getYaxix() { - int indexess = (timeSeries.length * 0.30).toInt(); for (int index = 0; index < timeSeries.length; index++) { - int mIndex = indexess * index; + int mIndex = indexes * index; if (mIndex < timeSeries.length) { yAxixs.add(timeSeries[mIndex].sales); } } } - // LineChartData sampleData1(context) { - // return LineChartData( - // lineTouchData: LineTouchData( - // touchTooltipData: LineTouchTooltipData( - // tooltipBgColor: Colors.white, - // ), - // touchCallback: (LineTouchResponse touchResponse) {}, - // handleBuiltInTouches: true, - // ), - // gridData: FlGridData(show: true, drawVerticalLine: true, drawHorizontalLine: true, horizontalInterval: 14, verticalInterval: 14), - // titlesData: FlTitlesData( - // bottomTitles: SideTitles( - // showTitles: true, - // getTextStyles: (value) => const TextStyle( - // color: Colors.black, - // fontSize: 10, - // ), - // // rotateAngle: 90, - // //rotateAngle:-65, - // margin: 22, - // getTitles: (value) { - // if (timeSeries.length < 15) { - // if (timeSeries.length > value.toInt()) { - // return '${timeSeries[value.toInt()].time.month}/ ${timeSeries[value.toInt()].time.year}'; - // } else - // return ''; - // } else { - // if (value.toInt() == 0) return '${timeSeries[value.toInt()].time.month}/ ${timeSeries[value.toInt()].time.year}'; - // if (value.toInt() == timeSeries.length - 1) return '${timeSeries[value.toInt()].time.month}/ ${timeSeries[value.toInt()].time.year}'; - // if (xAxixs.contains(value.toInt())) { - // return '${timeSeries[value.toInt()].time.month}/ ${timeSeries[value.toInt()].time.year}'; - // } - // } - // return ''; - // }, - // ), - // leftTitles: SideTitles( - // showTitles: true, - // // interval:getMaxY() - getMinY() <=500?50:getMaxY() - getMinY() <=1000?100:200, - // interval: 3, - // getTextStyles: (value) => const TextStyle( - // color: Colors.black, - // fontWeight: FontWeight.bold, - // fontSize: 10, - // ), - // - // margin: 12, - // ), - // ), - // borderData: FlBorderData( - // show: true, - // border: const Border( - // bottom: BorderSide( - // color: Colors.black, - // width: 0.5, - // ), - // left: BorderSide( - // color: Colors.black, - // ), - // right: BorderSide( - // color: Colors.black, - // ), - // top: BorderSide( - // color: Colors.transparent, - // ), - // ), - // ), - // minX: 0, - // maxX: (timeSeries.length - 1).toDouble(), - // maxY: getMaxY() + 0.3, - // minY: 0, - // //getMinY(), - // lineBarsData: getData(context), - // ); - // } - LineChartData sampleData1(context) { return LineChartData( lineTouchData: LineTouchData( @@ -166,7 +104,7 @@ class ShowChart extends StatelessWidget { touchCallback: (LineTouchResponse touchResponse) {}, handleBuiltInTouches: true, ), - gridData: FlGridData(show: true, drawVerticalLine: true, drawHorizontalLine: true, horizontalInterval: 14, verticalInterval: 14), + gridData: FlGridData(show: true, drawVerticalLine: true, drawHorizontalLine: true, horizontalInterval: horizontalInterval, verticalInterval: horizontalInterval), titlesData: FlTitlesData( bottomTitles: SideTitles( showTitles: true, @@ -200,15 +138,6 @@ class ShowChart extends StatelessWidget { fontSize: 10, ), interval: 3.0, - // interval: getMaxY() - getMinY() <= 500 - // ? getMaxY() - getMinY() <= 50 - // ? 10 - // : 10 - // : getMaxY() - getMinY() <= 1000 - // ? 100 - // : getMaxY() - getMinY() >= 10000 - // ? 5000 - // : 200, margin: 12, ), ), @@ -230,32 +159,73 @@ class ShowChart extends StatelessWidget { ), ), ), - minX: 0, - maxX: (timeSeries.length - 1).toDouble(), - maxY: getMaxY() + 0.3, - minY: 0, - //getMinY(), + minX: minX, + maxX: maxX, + maxY: lastY + 1, + minY: intialY - 0.5, lineBarsData: getData(context), ); } + calculateMaxAndMin() { + getMaxY(); + getMaxX(); + getMin(); + getMinY(); + increasingY = ((maxY - minY) / timeSeries.length - 1) * 15; + maxY += increasingY.abs(); + minY -= increasingY.abs(); + } + double getMaxY() { - double max = 0; + maxY = 0; + timeSeries.forEach((element) { + double resultValueDouble = element.sales; + if (resultValueDouble > maxY) { + lastY = resultValueDouble; + maxY = resultValueDouble; + } + }); + print("maxY " + lastY.toString()); + return maxY.roundToDouble(); + } + + double getInitialY() { + try { + intialY = timeSeries.first.sales; + timeSeries.forEach((element) { + double resultValueDouble = element.sales; + if (resultValueDouble < intialY) intialY = resultValueDouble; + }); + } catch (e) { + intialY = 0; + } + + print("minY " + intialY.toString()); + return intialY.roundToDouble(); + } + + getMaxX() { + maxX = (timeSeries.length - 1).toDouble(); + } + + double getMin() { + minX = 0; timeSeries.forEach((element) { double resultValueDouble = element.sales; - if (resultValueDouble > max) max = resultValueDouble; + if (resultValueDouble < minX) minX = resultValueDouble; }); - return max.roundToDouble(); + return minX.roundToDouble(); } double getMinY() { - double min = timeSeries.isEmpty ? 0 : timeSeries.first.sales; + minY = 0; timeSeries.forEach((element) { double resultValueDouble = element.sales; - if (resultValueDouble < min) min = resultValueDouble; + if (resultValueDouble < minY) minY = resultValueDouble; }); - int value = min.toInt(); + int value = minY.toInt(); return value.toDouble(); }