import 'package:diplomaticquarterapp/theme/colors.dart'; import 'package:diplomaticquarterapp/uitl/translations_delegate_base.dart'; 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'; class LineChartCurvedBloodPressure extends StatelessWidget { final String title; final List timeSeries1; final List timeSeries2; final int indexes; LineChartCurvedBloodPressure({required this.title, required this.timeSeries1, required this.indexes, required this.timeSeries2}); List xAxixs = []; List yAxixs = []; @override Widget build(BuildContext context) { getXaxix(); return AspectRatio( aspectRatio: 1.1, child: Container( decoration: const BoxDecoration( borderRadius: BorderRadius.all(Radius.circular(18)), // color: Colors.white, ), child: Stack( children: [ Column( crossAxisAlignment: CrossAxisAlignment.stretch, children: [ const SizedBox( height: 12, ), Padding( padding: const EdgeInsets.only( left: 20, right: 20, ), child: Text( title, style: TextStyle( color: Colors.black, fontSize: 16, letterSpacing: -0.64, fontWeight: FontWeight.w600, ), textAlign: TextAlign.start, ), ), SizedBox( height: 10, ), Expanded( child: Padding( padding: const EdgeInsets.only(right: 18.0, left: 16.0, top: 15), child: LineChart( sampleData1(context), duration: const Duration(milliseconds: 250), ), ), ), SizedBox( height: 10, ), Row( crossAxisAlignment: CrossAxisAlignment.center, mainAxisAlignment: MainAxisAlignment.center, children: [ Row( children: [ Container( width: 16, height: 16, decoration: containerRadius(Theme.of(context).primaryColor, 100), ), SizedBox( width: 5, ), Text( TranslationBase.of(context).systolicLng, style: TextStyle( color: Colors.black, fontSize: 12, letterSpacing: -0.64, fontWeight: FontWeight.w600, ), ), ], ), SizedBox( width: 15, ), Row( children: [ Container( width: 16, height: 16, decoration: containerRadius(CustomColors.accentColor, 100), ), SizedBox( width: 5, ), Text( TranslationBase.of(context).diastolicLng, style: TextStyle( color: Colors.black, fontSize: 12, letterSpacing: -0.64, fontWeight: FontWeight.w600, ), ), ], ), ], ), const SizedBox( height: 12, ), ], ), ], ), ), ); } getXaxix() { for (int index = 0; index < timeSeries1.length; index++) { int mIndex = indexes * index; if (mIndex < timeSeries1.length) { xAxixs.add(mIndex); } } } LineChartData sampleData1(context) { return LineChartData( lineTouchData: LineTouchData( touchTooltipData: LineTouchTooltipData( tooltipBgColor: Colors.white, ), touchCallback: (touchEvent, LineTouchResponse? touchResponse) {}, handleBuiltInTouches: true, ), gridData: FlGridData(show: true, drawVerticalLine: true, drawHorizontalLine: true, horizontalInterval: 14, verticalInterval: 14), titlesData: FlTitlesData( bottomTitles: AxisTitles( sideTitles: SideTitles( showTitles: true, getTitlesWidget: (value, title) { TextStyle style = TextStyle( color: Colors.black, fontSize: 10, ); if (timeSeries1.length < 15) { if (timeSeries1.length > value.toInt()) { return Text( '${timeSeries1[value.toInt()].time.month}/ ${timeSeries1[value.toInt()].time.year}', style: style, ); } else return SizedBox(); } else { if (value.toInt() == 0) return Text( '${timeSeries1[value.toInt()].time.month}/ ${timeSeries1[value.toInt()].time.year}', style: style, ); if (value.toInt() == timeSeries1.length - 1) return Text( '${timeSeries1[value.toInt()].time.month}/ ${timeSeries1[value.toInt()].time.year}', style: style, ); if (xAxixs.contains(value.toInt())) { return Text( '${timeSeries1[value.toInt()].time.month}/ ${timeSeries1[value.toInt()].time.year}', style: style, ); } } return SizedBox(); }, // rotateAngle: -65, // margin: 22, ), ), leftTitles: AxisTitles( sideTitles: SideTitles( showTitles: true, // getTextStyles: (cxt, value) => const TextStyle( // color: Colors.black, // fontWeight: FontWeight.bold, // fontSize: 10, // ), interval: getMaxY() - getMinY() <= 500 ? 50 : getMaxY() - getMinY() <= 1000 ? 100 : 200, // 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: (timeSeries1.length - 1).toDouble(), maxY: getMaxY() + 15, minY: getMinY() - 15, lineBarsData: getData(context), ); } double getMaxY() { double max = 0; timeSeries1.forEach((element) { double resultValueDouble = element.sales; if (resultValueDouble > max) max = resultValueDouble; }); timeSeries2.forEach((element) { double resultValueDouble = element.sales; if (resultValueDouble > max) max = resultValueDouble; }); return max.roundToDouble(); } double getMinY() { double min = timeSeries1[0].sales; timeSeries1.forEach((element) { double resultValueDouble = element.sales; if (resultValueDouble < min) min = resultValueDouble; }); timeSeries2.forEach((element) { double resultValueDouble = element.sales; if (resultValueDouble < min) min = resultValueDouble; }); int value = min.toInt(); return value.toDouble(); } List getData(context) { List spots = []; for (int index = 0; index < timeSeries1.length; index++) { spots.add(FlSpot(index.toDouble(), timeSeries1[index].sales)); } List spots2 = []; for (int index = 0; index < timeSeries2.length; index++) { spots2.add(FlSpot(index.toDouble(), timeSeries2[index].sales)); } final LineChartBarData lineChartBarData1 = LineChartBarData( spots: spots, isCurved: true, color: Colors.red, barWidth: 1.5, isStrokeCapRound: true, dotData: FlDotData( show: false, ), belowBarData: BarAreaData( show: false, ), ); final LineChartBarData lineChartBarData2 = LineChartBarData( spots: spots2, isCurved: true, color: Theme.of(context).primaryColor, barWidth: 1.5, isStrokeCapRound: true, dotData: FlDotData( show: false, ), belowBarData: BarAreaData( show: false, ), ); return [lineChartBarData1, lineChartBarData2]; } }