Skip to content
This repository has been archived by the owner on Jan 9, 2023. It is now read-only.

Update bar_secondary_axis.md #778

Closed
wants to merge 1 commit into from
Closed
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
25 changes: 16 additions & 9 deletions docs/flutter/example/axes/bar_secondary_axis.md
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@ Example:

```
/// Bar chart example

import 'package:flutter/material.dart';
import 'package:charts_flutter/flutter.dart' as charts;

Expand All @@ -22,7 +23,9 @@ import 'package:charts_flutter/flutter.dart' as charts;
/// secondaryMeasureAxisId.
///
/// Note: primary and secondary may flip left and right positioning when

/// RTL.flipAxisLocations is set.

class BarChartWithSecondaryAxis extends StatelessWidget {
static const secondaryMeasureAxisId = 'secondaryMeasureAxisId';
final List<charts.Series> seriesList;
Expand All @@ -43,11 +46,12 @@ class BarChartWithSecondaryAxis extends StatelessWidget {
Widget build(BuildContext context) {
return new charts.BarChart(
seriesList,
animate: animate,
animate: animate,
barGroupingType: charts.BarGroupingType.grouped,
// It is important when using both primary and secondary axes to choose
// the same number of ticks for both sides to get the gridlines to line
// up.

primaryMeasureAxis: new charts.NumericAxisSpec(
tickProviderSpec:
new charts.BasicNumericTickProviderSpec(desiredTickCount: 3)),
Expand All @@ -60,17 +64,17 @@ class BarChartWithSecondaryAxis extends StatelessWidget {
/// Create series list with multiple series
static List<charts.Series<OrdinalSales, String>> _createSampleData() {
final globalSalesData = [
new OrdinalSales('2014', 5000),
new OrdinalSales('2015', 25000),
new OrdinalSales('2016', 100000),
new OrdinalSales('2017', 750000),
OrdinalSales('2014', 5000),
OrdinalSales('2015', 25000),
OrdinalSales('2016', 100000),
OrdinalSales('2017', 750000),
];

final losAngelesSalesData = [
new OrdinalSales('2014', 25),
new OrdinalSales('2015', 50),
new OrdinalSales('2016', 10),
new OrdinalSales('2017', 20),
OrdinalSales('2014', 25),
OrdinalSales('2015', 50),
OrdinalSales('2016', 10),
OrdinalSales('2017', 20),
];

return [
Expand All @@ -86,14 +90,17 @@ class BarChartWithSecondaryAxis extends StatelessWidget {
measureFn: (OrdinalSales sales, _) => sales.sales,
data: losAngelesSalesData,
)..setAttribute(charts.measureAxisIdKey, secondaryMeasureAxisId)

// Set the 'Los Angeles Revenue' series to use the secondary measure axis.
// All series that have this set will use the secondary measure axis.
// All other series will use the primary measure axis.

];
}
}

/// Sample ordinal data type.

class OrdinalSales {
final String year;
final int sales;
Expand Down