I'm using fl_chart to make a weekly graph, however I'm running into a problem. The top of my left title tile, number 4 in this case, is getting cut off. Increasing the container just makes the graph portion take all the size, adding an empty toptitle didn't work either.
LineChart(
LineChartData(
backgroundColor: Theme.of(context).colorScheme.primary,
minY: 0,
maxY: highestweek.toDouble(),
minX: spotData.isNotEmpty ? spotData.first.x : 0,
titlesData: FlTitlesData(
topTitles: AxisTitles(
sideTitles: SideTitles(),
),
rightTitles: AxisTitles(
sideTitles: SideTitles(showTitles: false),
),
bottomTitles: AxisTitles(
sideTitles: SideTitles(
showTitles: spotData.isNotEmpty,
reservedSize: 70,
interval: const Duration(days: 30)
.inMilliseconds
.toDouble(),
getTitlesWidget: bottomTitleWidgets,
),
),
leftTitles: AxisTitles(
sideTitles: SideTitles(
showTitles: spotData.isNotEmpty,
getTitlesWidget: leftTitleWidgets,
reservedSize: highestweek > 999 ? 40 : 20,
),
),
),
gridData: FlGridData(
horizontalInterval:
const Duration(days: 30).inMilliseconds.toDouble(),
show: true,
getDrawingHorizontalLine: (value) {
return FlLine(
color: Theme.of(context).colorScheme.onPrimary,
strokeWidth: 1,
);
},
getDrawingVerticalLine: (value) {
return FlLine(
color: Theme.of(context).colorScheme.onPrimary,
strokeWidth: 1,
);
},
),
borderData: FlBorderData(
show: true,
border: Border.all(
color: const Color(0xff37434d), width: 1)),
lineBarsData: [
LineChartBarData(
barWidth: 4.5,
isStrokeCapRound: true,
begin: Alignment.centerLeft,
end: Alignment.centerRight,
),
color: widget.habit.color,
spots: spotData)
])),
Do you guys have any idea what can prevent this?
Setting an invisible widget & giving size to topTitles fixed it.
topTitles: AxisTitles(
sideTitles: SideTitles(
getTitlesWidget: (value, meta) => Container(),
showTitles: true,
reservedSize: 10,
),
),