imaNNeo
The bottomTitles duplicate when make liner Chart
** Don't make a duplicate issue. You can search in issues to make sure there isn't any already opened issue with your concern.
When i Make Liner Chart the bottomTitles duplicate like screenshot
LineChart(
LineChartData(
titlesData: FlTitlesData(
leftTitles: const AxisTitles(),
rightTitles: const AxisTitles(),
topTitles: const AxisTitles(),
bottomTitles: AxisTitles(
sideTitles: SideTitles(
showTitles: true,
getTitlesWidget: (value, meta) {
switch (value.toInt()) {
case 0:
return const Text('Jan');
case 1:
return const Text('Feb');
case 2:
return const Text('Mar');
case 3:
return const Text('Apr');
case 4:
return const Text('May');
case 5:
return const Text('Jun');
case 6:
return const Text('Jul');
default:
return const SizedBox.shrink();
}
},
reservedSize: 20,
),
),
),
lineBarsData: [
LineChartBarData(
isCurved: true,
color: Colors.green,
barWidth: 5,
isStrokeCapRound: true,
belowBarData: BarAreaData(show: false),
dotData: const FlDotData(show: false),
spots: [
const FlSpot(0, 2),
const FlSpot(1, 1.5),
const FlSpot(2, 3),
const FlSpot(3, 2.8),
const FlSpot(4, 3.5),
const FlSpot(5, 2.3),
const FlSpot(6, 3),
],
),
LineChartBarData(
isCurved: true,
color: Colors.red,
barWidth: 5,
isStrokeCapRound: true,
belowBarData: BarAreaData(show: false),
dotData: const FlDotData(show: false),
spots: [
const FlSpot(0, 1),
const FlSpot(1, 2),
const FlSpot(2, 1.5),
const FlSpot(3, 3),
const FlSpot(4, 2.8),
const FlSpot(5, 3.5),
const FlSpot(6, 2.5),
],
),
],
borderData: FlBorderData(
show: false, // Remove the gray border
),
gridData: const FlGridData(drawHorizontalLine: false),
),
),
),
Versions
- Flutter Version : 3.22.3
- fl_chart: ^0.69.0
If you assign value for interval property in SideTitles class, your current problem will be gone. According to your x-axis values, just set the interval property to 1.
I faced the same issue. I've noticed it happens when the number of spots is relatively small.
Setting the interval does work, but I wonder why it is not a default value.
