Reputation: 25
I'm trying to make a line chart using the library fl_chart
and dinamically add some side titles to it. As it was not working I went to see some examples of the library itself, and even the copied and pasted examples were not building up correctly. The problem can be seen in the image in the link below
LineChart with side titles copied from the example
The example example can be found in here
In the code below you can see the Object FLTitleData
that defines the titles to be shown it the final chart.
FlTitlesData(
show: true,
rightTitles: const AxisTitles(
sideTitles: SideTitles(showTitles: false),
),
// topTitles: const AxisTitles(
// sideTitles: SideTitles(showTitles: false),
// ),
topTitles: AxisTitles(
sideTitles: SideTitles(
getTitlesWidget: (value, meta) => Container(),
showTitles: true,
reservedSize: 10,
),
),
bottomTitles: AxisTitles(
sideTitles: SideTitles(
showTitles: true,
reservedSize: 30,
interval: 1,
getTitlesWidget: bottomTitleWidgets,
),
),
leftTitles: AxisTitles(
axisNameSize: 20,
axisNameWidget: Text(
'Valor',
style: TextStyle(color: CustomColours.vertraBlack),
),
sideTitles: SideTitles(
showTitles: true,
interval: 1,
getTitlesWidget: leftTitleWidgets,
reservedSize: 48,
),
),
),
Here is how the leftTitleWidgets
was defined:
Widget leftTitleWidgets(double value, TitleMeta meta) {
var style = TextStyle(
color: CustomColours.vertraBlack,
fontSize: 12,
);
return SideTitleWidget(
axisSide: meta.axisSide,
child: Text('\$ $value', style: style),
);
}
I expected it to be nicely generated and painted as shown in the examples of the library itself, but that was not the case as you saw. I hope someone can point me the error.
Upvotes: 2
Views: 252