imaNNeo / imaNNeo/fl_chart

Y axis clips chart size

Open
#1,191 3 comments 0 reactions 0 assignees View on GitHub
Needs Reproducible Code
Dominant language
Dart
Stars
7.6k
Forks
2k
Avg merge
9d 1h
Merged PRs (30d)
2

Description

**Describe the bug**
I think the picture shows pretty good what the problem is.
![image](https://user-images.githubusercontent.com/28623044/206875296-0005ea1a-0ba5-4110-8778-9e082f5ffd10.png)

**To Reproduce**
I don't have a whole file ready to reproduce, but at least here is the widget containing the chart.

`
SingleChildScrollView(
scrollDirection: Axis.horizontal,
child: SizedBox(
height: MediaQuery.of(context).size.height * 0.2,
width: bars.length * 40.0,
child: BarChart(
BarChartData(
gridData: FlGridData(
show: false,
),
alignment: BarChartAlignment.spaceEvenly,
barTouchData: BarTouchData(
enabled: true,
touchTooltipData: BarTouchTooltipData(
tooltipBgColor: Colors.transparent,
tooltipPadding: const EdgeInsets.all(0),
tooltipMargin: 6,
fitInsideVertically: true,
getTooltipItem: (
BarChartGroupData group,
int groupIndex,
BarChartRodData rod,
int rodIndex,
) {
return BarTooltipItem(
rod.toY.round().toString(), Theme.of(context).textTheme.subtitle2!);
},
),
),
titlesData: FlTitlesData(
show: true,
topTitles: AxisTitles(
sideTitles: SideTitles(showTitles: false),
),
bottomTitles: AxisTitles(
sideTitles: SideTitles(
showTitles: true,
reservedSize: 32,
getTitlesWidget: (value, meta) => Text(
DateFormat("MMM\n’yy")
.format(DateTime.fromMillisecondsSinceEpoch(value.round())),
style: Theme.of(context).textTheme.subtitle2!,
),
),
),
rightTitles: AxisTitles(
sideTitles: SideTitles(
interval: 500,
showTitles: true,
reservedSize: 60,
),
),
leftTitles: AxisTitles(
sideTitles: SideTitles(
interval: 500,
showTitles: true,
reservedSize: 60,
),
),
),
borderData: FlBorderData(
show: false,
),
barGroups: bars,
maxY: [...bars]
.sorted((a, b) => a.barRods.first.toY.compareTo(b.barRods.first.toY))
.last
.barRods
.first
.toY +
300,
),
),
`

**Versions**
- which version of the Flutter are you using? 3.3.9
- which version of the FlChart are you using? 0.55.2

If you need for more information please reach out.

Contributor guide

Open the contributing guide

Research direction

Start by reproducing the issue with the supplied BarChart widget configuration, especially the left and right axis titles and reserved sizes. Trace the BarChart rendering and axis-title layout entry points; done means the Y-axis labels and chart content are fully visible without clipping.

Written by the indexing model from the issue text.

Assessment

Tech stack
dart, flutter
Domain
data-visualization, mobile
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Needs clarification
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.