I've been trying to use charts_flutter prepared by google team in flutter. I was trying to use stacked bar charts and I was following this Stacked Bar Charts Demo. But, there is a tweak I want for my requirements. But, I couldn't figure out how to do it?.
Following is my code.
import 'package:flutter/material.dart';
import 'package:charts_flutter/flutter.dart' as charts;
class WeighAbleStatsScreenV3 extends StatefulWidget {
@override
_WeighAbleStatsScreenV3State createState() => _WeighAbleStatsScreenV3State();
}
class _WeighAbleStatsScreenV3State extends State<WeighAbleStatsScreenV3> {
List<charts.Series> seriesList;
/// Create series list with multiple series
static List<charts.Series<OrdinalSales, String>> _createSampleData() {
final desktopSalesData = [
OrdinalSales('2014', 25),
OrdinalSales('2015', 28),
OrdinalSales('2016', 26),
OrdinalSales('2017', 30),
];
final tableSalesData = [
OrdinalSales('2014', 3),
OrdinalSales('2015', 3),
OrdinalSales('2016', 2),
OrdinalSales('2017', 2),
];
final mobileSalesData = [
OrdinalSales('2014', 5),
OrdinalSales('2015', 4),
OrdinalSales('2016', 4),
OrdinalSales('2017', 2),
];
return [
charts.Series<OrdinalSales, String>(
id: 'Desktop',
domainFn: (OrdinalSales sales, _) => sales.year,
measureFn: (OrdinalSales sales, _) => sales.sales,
data: desktopSalesData,
),
charts.Series<OrdinalSales, String>(
id: 'Tablet',
domainFn: (OrdinalSales sales, _) => sales.year,
measureFn: (OrdinalSales sales, _) => sales.sales,
data: tableSalesData,
),
charts.Series<OrdinalSales, String>(
id: 'Mobile',
domainFn: (OrdinalSales sales, _) => sales.year,
measureFn: (OrdinalSales sales, _) => sales.sales,
data: mobileSalesData,
),
];
}
@override
void initState() {
super.initState();
seriesList = _createSampleData();
}
@override
Widget build(BuildContext context) {
return Scaffold(
body: SafeArea(
child: Container(
height: 500,
child: charts.BarChart(
seriesList,
animate: true,
barGroupingType: charts.BarGroupingType.stacked,
),
),
),
);
}
}
/// Sample ordinal data type.
class OrdinalSales {
final String year;
final int sales;
OrdinalSales(this.year, this.sales);
}
Output :
Charts are working fine. But, I want Y-axis to be dynamic and non-zero. For example, minimum value for charts data in my case is 25. So, my y-axis values should be 25-35 instead of starting from 0-35.
I do not want zero as starting point for my Y-axis values. But, I couldn't add non-numeric values or values above zero.
Also, It's best if I can add string values to my Y-axis as well?
I've followed documentation thoroughly. But, couldn't find anything.
Any help would be appreciated.
Thanks.
from charts_flutter - How to support non-zero Y-Axis values in bar chart with multiple stacks?
No comments:
Post a Comment