The date X axis not corrected
- Dominant language
- Dart
- Stars
- 7.6k
- Forks
- 2k
- Avg merge
- 9d 1h
- Merged PRs (30d)
- 2
Description
Hi folks,
I've got a small issue here, so the graph not showing properly. Lemme explain the data first. I used the Line chart data with DateTime.
`"data": [{
"dimensions": {
"timestamp": "2023-06-26T00:00:00.000Z"
},
"event": {
"count": 1,
"ontime_percentage": 0,
"order_delayed": 1,
"order_ontime": 0
}
}, {
"dimensions": {
"timestamp": "2023-07-05T00:00:00.000Z"
},
"event": {
"count": 5,
"ontime_percentage": 0.4,
"order_delayed": 3,
"order_ontime": 2
}
}, {
"dimensions": {
"timestamp": "2023-07-07T00:00:00.000Z"
},
"event": {
"count": 21,
"ontime_percentage": 0,
"order_delayed": 21,
"order_ontime": 0
}
}
}],`
But this's the chart data that the app has parsed
[(26.0, 0.0), (5.0, 0.4), (7.0, 1.0)]
the minX in the chart starts from 1, maxX start from 30. Hence, (26.0, 0.0) is put in the end by the library, that's why we have this weird graph.

This's our code
`Widget bottomTitleWidgets(double value, TitleMeta meta) {
return SideTitleWidget(
axisSide: meta.axisSide,
space: 4,
child: Text('${value.toInt()}',),
);
}`
`LineChart(LineChartData(
gridData: FlGridData(show: false),
borderData: FlBorderData(show: false),
titlesData: FlTitlesData(
show: true,
rightTitles: AxisTitles(
sideTitles: SideTitles(showTitles: false),
),
topTitles: AxisTitles(
sideTitles: SideTitles(showTitles: false),
),
leftTitles: AxisTitles(
sideTitles: SideTitles(showTitles: false),
),
bottomTitles: AxisTitles(
sideTitles: SideTitles(showTitles: true, reservedSize: 24, getTitlesWidget: bottomTitleWidgets),
),
),
lineBarsData: [
LineChartBarData(
spots: sourceList,
isCurved: true,
gradient: const LinearGradient(
colors: [MexColors.brandGrabGreen, MexColors.brandTropicalGreen],
),
barWidth: 2,
isStrokeCapRound: true,
dotData: FlDotData(
show: true,
),
belowBarData: BarAreaData(
show: true,
gradient: LinearGradient(
begin: FractionalOffset.bottomCenter,
end: FractionalOffset.topCenter,
colors: [MexColors.brandDugongGreen, MexColors.brandGrabGreen].map((color) => color.withOpacity(0.2)).toList(),
),
),
)
],
minX: 1,
maxX: 30));`
Lib version fl_chart: ^0.55.2. Thanks
Contributor guide
Research direction
Reproduce the issue with the DateTime data, sourceList, and LineChartData configuration shown in the report. Start at the LineChart axis handling and inspect how the supplied spots interact with minX and maxX; done means the dated points appear in chronological x-axis order without breaking explicit numeric x values.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- dart, flutter
- Domain
- data-visualization
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100