I'm working on a Flutter chart and I'm encountering two issues:
1. Double Y-Axis Labels: The y-axis is displaying duplicate labels for some values. How can I fix this to show only one label per value?
2. Yellow Lines: Yellow lines appear underneath my chart. What might cause these lines and how do I remove them?
Image:
Code:
import 'package:fl_chart/fl_chart.dart';
import 'package:flutter/material.dart';
class LineTitles {
static GetTitleData() => FlTitlesData(
show: true,
bottomTitles: AxisTitles(
sideTitles: SideTitles(
showTitles: true,
reservedSize: 35,
getTitlesWidget: (value, meta) {
switch (value.toInt()) {
case 2:
return Text(
'MAR',
style: TextStyle(
color: Color(0xff68737d),
fontWeight: FontWeight.bold,
fontSize: 16,
),
);
case 5:
return Text(
'JUN',
style: TextStyle(
color: Color(0xff68737d),
fontWeight: FontWeight.bold,
fontSize: 16,
),
);
case 8:
return Text('SEP',
style: TextStyle(
color: Color(0xff68737d),
fontWeight: FontWeight.bold,
fontSize: 16,
));
}
return Text(" ");
}),
),
leftTitles: AxisTitles(
sideTitles: SideTitles(
showTitles: true,
reservedSize: 35,
getTitlesWidget: (value, meta) {
switch (value.toInt()) {
case 1:
return Text(
'10k',
style: TextStyle(
color: Color(0xff68737d),
fontWeight: FontWeight.bold,
fontSize: 15,
),
);
case 3:
return Text(
'30k',
style: TextStyle(
color: Color(0xff68737d),
fontWeight: FontWeight.bold,
fontSize: 15,
),
);
case 5:
return Text('50k',
style: TextStyle(
color: Color(0xff68737d),
fontWeight: FontWeight.bold,
fontSize: 15,
)
);
}
return Text(" ");
},
)));
}
Things I've tried:
I tried uninstalling and reinstalling the app, but it didn't resolve the issues.
Use Scaffold
as your parent widget.
Scaffold(
body: ///rest of your widgets here
)