我需要 10 行来在 leftTitleWidgets 上显示我的数据 (0, 2, 2.25, ...... 4)。但是 FlSpot 的值最大为 4。因此,只有当其值为 4 时,数据才会与 2.75 一起显示。我该如何解决这个问题?
我需要 10 行来显示我的数据 (0, 2, 2.25, ...... 4)
。 leftTitleWidgets
但是的值 FlSpot
最大为 4。因此,只有当其值为 4 时,数据才会与 2.75 一起显示。我该如何解决这个问题?
这就是我得到的……
我想要的东西...
这是我的代码
import 'package:diu_result/controller/semester_result_controller.dart';
import 'package:diu_result/model/semester_cgpa_model.dart';
import 'package:fl_chart/fl_chart.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import '../../../utils/const/app_color.dart';
class LineChartSample2 extends StatefulWidget {
const LineChartSample2({super.key});
@override
State<LineChartSample2> createState() => _LineChartSample2State();
}
class _LineChartSample2State extends State<LineChartSample2> {
final controller = Get.find<SemesterResultController>();
List<Color> gradientColors = [
AppColors.contentColorCyan,
AppColors.contentColorBlue,
];
bool showAvg = false;
@override
Widget build(BuildContext context) {
return Stack(
children: <Widget>[
AspectRatio(
aspectRatio: .8,
child: Padding(
padding: const EdgeInsets.only(
right: 0,
left: 0,
top: 24,
bottom: 20,
),
child: LineChart(
showAvg ? avgData() : mainData(),
),
),
),
SizedBox(
width: 60,
height: 34,
child: TextButton(
onPressed: () {
setState(() {
showAvg = !showAvg;
});
},
child: Text(
'avg',
style: TextStyle(
fontSize: 12,
color: showAvg ? Colors.white.withOpacity(0.5) : Colors.white,
),
),
),
),
],
);
}
Widget bottomTitleWidgets(double value, TitleMeta meta) {
const style = TextStyle(
fontWeight: FontWeight.bold,
fontSize: 10,
);
// Convert the double value to an int for comparison
int index = value.toInt() - 1;
// Initialize a variable to hold the widget
Widget text;
// Check if the index is within the bounds of the semesterCgpaList
if (index >= 0 && index < controller.semesterNameCg.length) {
// Get the corresponding SemesterCgpaModel
SemesterCgpaModel semesterCgpa = controller.semesterNameCg[index];
// Create the text widget with the semester name and year
text = Text(
'${semesterCgpa.semesterName}\n${semesterCgpa.semesterYear}',
style: style,
textAlign: TextAlign.center,
);
} else {
text = const Text('', style: style);
}
return SideTitleWidget(
axisSide: meta.axisSide,
child: text,
);
}
Widget leftTitleWidgets(double value, TitleMeta meta) {
const style = TextStyle(
fontWeight: FontWeight.bold,
fontSize: 12,
);
String text;
switch (value) {
case 0:
text = '0.0';
break;
case 1:
text = '2.0';
break;
case 2:
text = '2.25';
break;
case 3:
text = '2.5';
break;
case 4:
text = '2.75';
break;
case 5:
text = '3.0';
break;
case 6:
text = '3.25';
break;
case 7:
text = '3.5';
break;
case 8:
text = '3.75';
break;
case 9:
text = '4.0';
break;
default:
return Container();
}
return Text(text, style: style, textAlign: TextAlign.left);
}
LineChartData mainData() {
return LineChartData(
gridData: FlGridData(
show: true,
drawVerticalLine: false,
horizontalInterval: 1,
verticalInterval: 1,
getDrawingHorizontalLine: (value) {
return const FlLine(
color: AppColors.mainGridLineColor,
strokeWidth: 1,
);
},
),
titlesData: FlTitlesData(
show: true,
rightTitles: const AxisTitles(
sideTitles: SideTitles(showTitles: false),
),
topTitles: const AxisTitles(
sideTitles: SideTitles(showTitles: false),
),
bottomTitles: AxisTitles(
sideTitles: SideTitles(
showTitles: true,
reservedSize: 40,
interval: 1,
getTitlesWidget: bottomTitleWidgets,
),
),
leftTitles: AxisTitles(
sideTitles: SideTitles(
showTitles: true,
interval: 1,
getTitlesWidget: leftTitleWidgets,
reservedSize: 32,
),
),
),
borderData: FlBorderData(
show: false,
border: Border.all(color: const Color(0xff37434d)),
),
minX: .8,
maxX: controller.semesterNameCg.length.toDouble() + 1,
minY: 0,
maxY: 10,
lineBarsData: [
LineChartBarData(
spots: List.generate(
controller.semesterNameCg.length,
(index) {
final cgpa = controller.semesterNameCg[index].cgpa;
return FlSpot(index.toDouble() + 1, cgpa);
},
),
isCurved: true,
gradient: LinearGradient(colors: gradientColors),
barWidth: 3,
isStrokeCapRound: true,
dotData: const FlDotData(show: true),
belowBarData: BarAreaData(
show: true,
gradient: LinearGradient(
colors: gradientColors
.map((color) => color.withOpacity(0.3))
.toList(),
),
),
),
],
);
}
LineChartData avgData() {
return LineChartData(
lineTouchData: const LineTouchData(enabled: false),
gridData: FlGridData(
show: true,
drawHorizontalLine: true,
verticalInterval: 1,
horizontalInterval: 1,
getDrawingVerticalLine: (value) {
return const FlLine(
color: Color(0xff37434d),
strokeWidth: 0,
);
},
getDrawingHorizontalLine: (value) {
return const FlLine(
color: Color(0xff37434d),
strokeWidth: 1,
);
},
),
titlesData: FlTitlesData(
show: true,
bottomTitles: AxisTitles(
sideTitles: SideTitles(
showTitles: true,
reservedSize: 30,
getTitlesWidget: bottomTitleWidgets,
interval: 1,
),
),
leftTitles: AxisTitles(
sideTitles: SideTitles(
showTitles: true,
getTitlesWidget: leftTitleWidgets,
reservedSize: 32,
interval: 1,
),
),
topTitles: const AxisTitles(
sideTitles: SideTitles(showTitles: false),
),
rightTitles: const AxisTitles(
sideTitles: SideTitles(showTitles: false),
),
),
borderData: FlBorderData(
show: true,
border: Border.all(color: const Color(0xff37434d)),
),
minX: 0,
maxX: 10,
minY: 0,
maxY: 11,
lineBarsData: [
LineChartBarData(
spots: const [
FlSpot(0, 3.44),
FlSpot(2.6, 3.44),
FlSpot(4.9, 3.44),
FlSpot(6.8, 3.44),
FlSpot(8, 3.44),
FlSpot(9.5, 3.44),
FlSpot(11, 3.44),
],
isCurved: true,
gradient: LinearGradient(
colors: [
ColorTween(begin: gradientColors[0], end: gradientColors[1])
.lerp(0.2)!,
ColorTween(begin: gradientColors[0], end: gradientColors[1])
.lerp(0.2)!,
],
),
barWidth: 5,
isStrokeCapRound: true,
dotData: const FlDotData(show: false),
belowBarData: BarAreaData(
show: true,
gradient: LinearGradient(
colors: [
ColorTween(begin: gradientColors[0], end: gradientColors[1])
.lerp(0.2)!
.withOpacity(0.1),
ColorTween(begin: gradientColors[0], end: gradientColors[1])
.lerp(0.2)!
.withOpacity(0.1),
],
),
),
),
],
);
}
}