Starter/samples
1
0
Fork 0
mirror of https://github.com/flutter/samples.git synced 2026-05-16 20:08:51 +00:00
Code Issues Releases Wiki Activity

web/chart: fix sample (#909)

Browse Source
This commit is contained in:
Brett Morgan
2021-10-07 08:10:34 +11:00
committed by GitHub
parent 0fe216a1cf
commit 2d9ba2f9eb
118 changed files with 3655 additions and 3511 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
web/charts/lib/i18n/i18n_gallery.dart
View File

@@ -22,29 +22,29 @@ import 'rtl_series_legend.dart';
List<GalleryScaffold> buildGallery() {
return [
new GalleryScaffold(
listTileIcon: new Icon(Icons.flag),
GalleryScaffold(
listTileIcon: const Icon(Icons.flag),
title: 'RTL Bar Chart',
subtitle: 'Simple bar chart in RTL',
childBuilder: () => new RTLBarChart.withRandomData(),
childBuilder: () => RTLBarChart.withRandomData(),
),
new GalleryScaffold(
listTileIcon: new Icon(Icons.flag),
GalleryScaffold(
listTileIcon: const Icon(Icons.flag),
title: 'RTL Line Chart',
subtitle: 'Simple line chart in RTL',
childBuilder: () => new RTLLineChart.withRandomData(),
childBuilder: () => RTLLineChart.withRandomData(),
),
new GalleryScaffold(
listTileIcon: new Icon(Icons.flag),
GalleryScaffold(
listTileIcon: const Icon(Icons.flag),
title: 'RTL Line Segments',
subtitle: 'Stacked area chart with style segments in RTL',
childBuilder: () => new RTLLineSegments.withRandomData(),
childBuilder: () => RTLLineSegments.withRandomData(),
),
new GalleryScaffold(
listTileIcon: new Icon(Icons.flag),
GalleryScaffold(
listTileIcon: const Icon(Icons.flag),
title: 'RTL Series Legend',
subtitle: 'Series legend in RTL',
childBuilder: () => new RTLSeriesLegend.withRandomData(),
childBuilder: () => RTLSeriesLegend.withRandomData(),
),
];
}

32
web/charts/lib/i18n/rtl_bar_chart.dart
View File

@@ -24,11 +24,11 @@ class RTLBarChart extends StatelessWidget {
final List<charts.Series> seriesList;
final bool animate;
RTLBarChart(this.seriesList, {this.animate});
const RTLBarChart(this.seriesList, {this.animate, Key key}) : super(key: key);
/// Creates a [BarChart] with sample data and no transition.
factory RTLBarChart.withSampleData() {
return new RTLBarChart(
return RTLBarChart(
_createSampleData(),
// Disable animations for image tests.
animate: false,
@@ -40,22 +40,22 @@ class RTLBarChart extends StatelessWidget {
// It is used for creating random series data to demonstrate animation in
// the example app only.
factory RTLBarChart.withRandomData() {
return new RTLBarChart(_createRandomData());
return RTLBarChart(_createRandomData());
}
/// Create random data.
static List<charts.Series<OrdinalSales, String>> _createRandomData() {
final random = new Random();
final random = Random();
final data = [
new OrdinalSales('2014', random.nextInt(100)),
new OrdinalSales('2015', random.nextInt(100)),
new OrdinalSales('2016', random.nextInt(100)),
new OrdinalSales('2017', random.nextInt(100)),
OrdinalSales('2014', random.nextInt(100)),
OrdinalSales('2015', random.nextInt(100)),
OrdinalSales('2016', random.nextInt(100)),
OrdinalSales('2017', random.nextInt(100)),
];
return [
new charts.Series<OrdinalSales, String>(
charts.Series<OrdinalSales, String>(
id: 'Sales',
domainFn: (OrdinalSales sales, _) => sales.year,
measureFn: (OrdinalSales sales, _) => sales.sales,
@@ -81,9 +81,9 @@ class RTLBarChart extends StatelessWidget {
//
// Optionally, [RTLSpec] can be passed in when creating the chart to specify
// chart display settings in RTL mode.
return new Directionality(
return Directionality(
textDirection: TextDirection.rtl,
child: new charts.BarChart(
child: charts.BarChart(
seriesList,
animate: animate,
vertical: false,
@@ -93,14 +93,14 @@ class RTLBarChart extends StatelessWidget {
/// Create one series with sample hard coded data.
static List<charts.Series<OrdinalSales, String>> _createSampleData() {
final data = [
new OrdinalSales('2014', 5),
new OrdinalSales('2015', 25),
new OrdinalSales('2016', 100),
new OrdinalSales('2017', 75),
OrdinalSales('2014', 5),
OrdinalSales('2015', 25),
OrdinalSales('2016', 100),
OrdinalSales('2017', 75),
];
return [
new charts.Series<OrdinalSales, String>(
charts.Series<OrdinalSales, String>(
id: 'Sales',
domainFn: (OrdinalSales sales, _) => sales.year,
measureFn: (OrdinalSales sales, _) => sales.sales,

33
web/charts/lib/i18n/rtl_line_chart.dart
View File

@@ -24,11 +24,12 @@ class RTLLineChart extends StatelessWidget {
final List<charts.Series> seriesList;
final bool animate;
RTLLineChart(this.seriesList, {this.animate});
const RTLLineChart(this.seriesList, {this.animate, Key key})
: super(key: key);
/// Creates a [LineChart] with sample data and no transition.
factory RTLLineChart.withSampleData() {
return new RTLLineChart(
return RTLLineChart(
_createSampleData(),
// Disable animations for image tests.
animate: false,
@@ -40,22 +41,22 @@ class RTLLineChart extends StatelessWidget {
// It is used for creating random series data to demonstrate animation in
// the example app only.
factory RTLLineChart.withRandomData() {
return new RTLLineChart(_createRandomData());
return RTLLineChart(_createRandomData());
}
/// Create random data.
static List<charts.Series<LinearSales, num>> _createRandomData() {
final random = new Random();
final random = Random();
final data = [
new LinearSales(0, random.nextInt(100)),
new LinearSales(1, random.nextInt(100)),
new LinearSales(2, random.nextInt(100)),
new LinearSales(3, random.nextInt(100)),
LinearSales(0, random.nextInt(100)),
LinearSales(1, random.nextInt(100)),
LinearSales(2, random.nextInt(100)),
LinearSales(3, random.nextInt(100)),
];
return [
new charts.Series<LinearSales, int>(
charts.Series<LinearSales, int>(
id: 'Sales',
domainFn: (LinearSales sales, _) => sales.year,
measureFn: (LinearSales sales, _) => sales.sales,
@@ -78,9 +79,9 @@ class RTLLineChart extends StatelessWidget {
// Measure axis positions are flipped. Primary measure axis is on the right
// and the secondary measure axis is on the left (when used).
// Domain axis' first domain starts on the right and grows left.
return new Directionality(
return Directionality(
textDirection: TextDirection.rtl,
child: new charts.LineChart(
child: charts.LineChart(
seriesList,
animate: animate,
));
@@ -89,14 +90,14 @@ class RTLLineChart extends StatelessWidget {
/// Create one series with sample hard coded data.
static List<charts.Series<LinearSales, int>> _createSampleData() {
final data = [
new LinearSales(0, 5),
new LinearSales(1, 25),
new LinearSales(2, 100),
new LinearSales(3, 75),
LinearSales(0, 5),
LinearSales(1, 25),
LinearSales(2, 100),
LinearSales(3, 75),
];
return [
new charts.Series<LinearSales, int>(
charts.Series<LinearSales, int>(
id: 'Sales',
domainFn: (LinearSales sales, _) => sales.year,
measureFn: (LinearSales sales, _) => sales.sales,

111
web/charts/lib/i18n/rtl_line_segments.dart
View File

@@ -35,11 +35,12 @@ class RTLLineSegments extends StatelessWidget {
final List<charts.Series> seriesList;
final bool animate;
RTLLineSegments(this.seriesList, {this.animate});
const RTLLineSegments(this.seriesList, {this.animate, Key key})
: super(key: key);
/// Creates a [LineChart] with sample data and no transition.
factory RTLLineSegments.withSampleData() {
return new RTLLineSegments(
return RTLLineSegments(
_createSampleData(),
// Disable animations for image tests.
animate: false,
@@ -51,45 +52,45 @@ class RTLLineSegments extends StatelessWidget {
// It is used for creating random series data to demonstrate animation in
// the example app only.
factory RTLLineSegments.withRandomData() {
return new RTLLineSegments(_createRandomData());
return RTLLineSegments(_createRandomData());
}
/// Create random data.
static List<charts.Series<LinearSales, num>> _createRandomData() {
final random = new Random();
final random = Random();
// Series of data with static dash pattern and stroke width. The colorFn
// accessor will colorize each datum (for all three series).
final colorChangeData = [
new LinearSales(0, random.nextInt(100), null, 2.0),
new LinearSales(1, random.nextInt(100), null, 2.0),
new LinearSales(2, random.nextInt(100), null, 2.0),
new LinearSales(3, random.nextInt(100), null, 2.0),
new LinearSales(4, random.nextInt(100), null, 2.0),
new LinearSales(5, random.nextInt(100), null, 2.0),
new LinearSales(6, random.nextInt(100), null, 2.0),
LinearSales(0, random.nextInt(100), null, 2.0),
LinearSales(1, random.nextInt(100), null, 2.0),
LinearSales(2, random.nextInt(100), null, 2.0),
LinearSales(3, random.nextInt(100), null, 2.0),
LinearSales(4, random.nextInt(100), null, 2.0),
LinearSales(5, random.nextInt(100), null, 2.0),
LinearSales(6, random.nextInt(100), null, 2.0),
];
// Series of data with changing color and dash pattern.
final dashPatternChangeData = [
new LinearSales(0, random.nextInt(100), [2, 2], 2.0),
new LinearSales(1, random.nextInt(100), [2, 2], 2.0),
new LinearSales(2, random.nextInt(100), [4, 4], 2.0),
new LinearSales(3, random.nextInt(100), [4, 4], 2.0),
new LinearSales(4, random.nextInt(100), [4, 4], 2.0),
new LinearSales(5, random.nextInt(100), [8, 3, 2, 3], 2.0),
new LinearSales(6, random.nextInt(100), [8, 3, 2, 3], 2.0),
LinearSales(0, random.nextInt(100), [2, 2], 2.0),
LinearSales(1, random.nextInt(100), [2, 2], 2.0),
LinearSales(2, random.nextInt(100), [4, 4], 2.0),
LinearSales(3, random.nextInt(100), [4, 4], 2.0),
LinearSales(4, random.nextInt(100), [4, 4], 2.0),
LinearSales(5, random.nextInt(100), [8, 3, 2, 3], 2.0),
LinearSales(6, random.nextInt(100), [8, 3, 2, 3], 2.0),
];
// Series of data with changing color and stroke width.
final strokeWidthChangeData = [
new LinearSales(0, random.nextInt(100), null, 2.0),
new LinearSales(1, random.nextInt(100), null, 2.0),
new LinearSales(2, random.nextInt(100), null, 4.0),
new LinearSales(3, random.nextInt(100), null, 4.0),
new LinearSales(4, random.nextInt(100), null, 4.0),
new LinearSales(5, random.nextInt(100), null, 6.0),
new LinearSales(6, random.nextInt(100), null, 6.0),
LinearSales(0, random.nextInt(100), null, 2.0),
LinearSales(1, random.nextInt(100), null, 2.0),
LinearSales(2, random.nextInt(100), null, 4.0),
LinearSales(3, random.nextInt(100), null, 4.0),
LinearSales(4, random.nextInt(100), null, 4.0),
LinearSales(5, random.nextInt(100), null, 6.0),
LinearSales(6, random.nextInt(100), null, 6.0),
];
// Generate 2 shades of each color so that we can style the line segments.
@@ -98,7 +99,7 @@ class RTLLineSegments extends StatelessWidget {
final green = charts.MaterialPalette.green.makeShades(2);
return [
new charts.Series<LinearSales, int>(
charts.Series<LinearSales, int>(
id: 'Color Change',
// Light shade for even years, dark shade for odd.
colorFn: (LinearSales sales, _) =>
@@ -109,7 +110,7 @@ class RTLLineSegments extends StatelessWidget {
measureFn: (LinearSales sales, _) => sales.sales,
data: colorChangeData,
),
new charts.Series<LinearSales, int>(
charts.Series<LinearSales, int>(
id: 'Dash Pattern Change',
// Light shade for even years, dark shade for odd.
colorFn: (LinearSales sales, _) =>
@@ -120,7 +121,7 @@ class RTLLineSegments extends StatelessWidget {
measureFn: (LinearSales sales, _) => sales.sales,
data: dashPatternChangeData,
),
new charts.Series<LinearSales, int>(
charts.Series<LinearSales, int>(
id: 'Stroke Width Change',
// Light shade for even years, dark shade for odd.
colorFn: (LinearSales sales, _) =>
@@ -148,12 +149,12 @@ class RTLLineSegments extends StatelessWidget {
// Measure axis positions are flipped. Primary measure axis is on the right
// and the secondary measure axis is on the left (when used).
// Domain axis' first domain starts on the right and grows left.
return new Directionality(
return Directionality(
textDirection: TextDirection.rtl,
child: new charts.LineChart(
child: charts.LineChart(
seriesList,
defaultRenderer:
new charts.LineRendererConfig(includeArea: true, stacked: true),
charts.LineRendererConfig(includeArea: true, stacked: true),
animate: animate,
));
}
@@ -163,35 +164,35 @@ class RTLLineSegments extends StatelessWidget {
// Series of data with static dash pattern and stroke width. The colorFn
// accessor will colorize each datum (for all three series).
final colorChangeData = [
new LinearSales(0, 5, null, 2.0),
new LinearSales(1, 15, null, 2.0),
new LinearSales(2, 25, null, 2.0),
new LinearSales(3, 75, null, 2.0),
new LinearSales(4, 100, null, 2.0),
new LinearSales(5, 90, null, 2.0),
new LinearSales(6, 75, null, 2.0),
LinearSales(0, 5, null, 2.0),
LinearSales(1, 15, null, 2.0),
LinearSales(2, 25, null, 2.0),
LinearSales(3, 75, null, 2.0),
LinearSales(4, 100, null, 2.0),
LinearSales(5, 90, null, 2.0),
LinearSales(6, 75, null, 2.0),
];
// Series of data with changing color and dash pattern.
final dashPatternChangeData = [
new LinearSales(0, 5, [2, 2], 2.0),
new LinearSales(1, 15, [2, 2], 2.0),
new LinearSales(2, 25, [4, 4], 2.0),
new LinearSales(3, 75, [4, 4], 2.0),
new LinearSales(4, 100, [4, 4], 2.0),
new LinearSales(5, 90, [8, 3, 2, 3], 2.0),
new LinearSales(6, 75, [8, 3, 2, 3], 2.0),
LinearSales(0, 5, [2, 2], 2.0),
LinearSales(1, 15, [2, 2], 2.0),
LinearSales(2, 25, [4, 4], 2.0),
LinearSales(3, 75, [4, 4], 2.0),
LinearSales(4, 100, [4, 4], 2.0),
LinearSales(5, 90, [8, 3, 2, 3], 2.0),
LinearSales(6, 75, [8, 3, 2, 3], 2.0),
];
// Series of data with changing color and stroke width.
final strokeWidthChangeData = [
new LinearSales(0, 5, null, 2.0),
new LinearSales(1, 15, null, 2.0),
new LinearSales(2, 25, null, 4.0),
new LinearSales(3, 75, null, 4.0),
new LinearSales(4, 100, null, 4.0),
new LinearSales(5, 90, null, 6.0),
new LinearSales(6, 75, null, 6.0),
LinearSales(0, 5, null, 2.0),
LinearSales(1, 15, null, 2.0),
LinearSales(2, 25, null, 4.0),
LinearSales(3, 75, null, 4.0),
LinearSales(4, 100, null, 4.0),
LinearSales(5, 90, null, 6.0),
LinearSales(6, 75, null, 6.0),
];
// Generate 2 shades of each color so that we can style the line segments.
@@ -200,7 +201,7 @@ class RTLLineSegments extends StatelessWidget {
final green = charts.MaterialPalette.green.makeShades(2);
return [
new charts.Series<LinearSales, int>(
charts.Series<LinearSales, int>(
id: 'Color Change',
// Light shade for even years, dark shade for odd.
colorFn: (LinearSales sales, _) =>
@@ -211,7 +212,7 @@ class RTLLineSegments extends StatelessWidget {
measureFn: (LinearSales sales, _) => sales.sales,
data: colorChangeData,
),
new charts.Series<LinearSales, int>(
charts.Series<LinearSales, int>(
id: 'Dash Pattern Change',
// Light shade for even years, dark shade for odd.
colorFn: (LinearSales sales, _) =>
@@ -222,7 +223,7 @@ class RTLLineSegments extends StatelessWidget {
measureFn: (LinearSales sales, _) => sales.sales,
data: dashPatternChangeData,
),
new charts.Series<LinearSales, int>(
charts.Series<LinearSales, int>(
id: 'Stroke Width Change',
// Light shade for even years, dark shade for odd.
colorFn: (LinearSales sales, _) =>

95
web/charts/lib/i18n/rtl_series_legend.dart
View File

@@ -24,11 +24,12 @@ class RTLSeriesLegend extends StatelessWidget {
final List<charts.Series> seriesList;
final bool animate;
RTLSeriesLegend(this.seriesList, {this.animate});
const RTLSeriesLegend(this.seriesList, {this.animate, Key key})
: super(key: key);
/// Creates a [BarChart] with sample data and no transition.
factory RTLSeriesLegend.withSampleData() {
return new RTLSeriesLegend(
return RTLSeriesLegend(
_createSampleData(),
// Disable animations for image tests.
animate: false,
@@ -40,61 +41,61 @@ class RTLSeriesLegend extends StatelessWidget {
// It is used for creating random series data to demonstrate animation in
// the example app only.
factory RTLSeriesLegend.withRandomData() {
return new RTLSeriesLegend(_createRandomData());
return RTLSeriesLegend(_createRandomData());
}
/// Create random data.
static List<charts.Series<OrdinalSales, String>> _createRandomData() {
final random = new Random();
final random = Random();
final desktopSalesData = [
new OrdinalSales('2014', random.nextInt(100)),
new OrdinalSales('2015', random.nextInt(100)),
new OrdinalSales('2016', random.nextInt(100)),
new OrdinalSales('2017', random.nextInt(100)),
OrdinalSales('2014', random.nextInt(100)),
OrdinalSales('2015', random.nextInt(100)),
OrdinalSales('2016', random.nextInt(100)),
OrdinalSales('2017', random.nextInt(100)),
];
final tabletSalesData = [
new OrdinalSales('2014', random.nextInt(100)),
new OrdinalSales('2015', random.nextInt(100)),
new OrdinalSales('2016', random.nextInt(100)),
new OrdinalSales('2017', random.nextInt(100)),
OrdinalSales('2014', random.nextInt(100)),
OrdinalSales('2015', random.nextInt(100)),
OrdinalSales('2016', random.nextInt(100)),
OrdinalSales('2017', random.nextInt(100)),
];
final mobileSalesData = [
new OrdinalSales('2014', random.nextInt(100)),
new OrdinalSales('2015', random.nextInt(100)),
new OrdinalSales('2016', random.nextInt(100)),
new OrdinalSales('2017', random.nextInt(100)),
OrdinalSales('2014', random.nextInt(100)),
OrdinalSales('2015', random.nextInt(100)),
OrdinalSales('2016', random.nextInt(100)),
OrdinalSales('2017', random.nextInt(100)),
];
final otherSalesData = [
new OrdinalSales('2014', random.nextInt(100)),
new OrdinalSales('2015', random.nextInt(100)),
new OrdinalSales('2016', random.nextInt(100)),
new OrdinalSales('2017', random.nextInt(100)),
OrdinalSales('2014', random.nextInt(100)),
OrdinalSales('2015', random.nextInt(100)),
OrdinalSales('2016', random.nextInt(100)),
OrdinalSales('2017', random.nextInt(100)),
];
return [
new charts.Series<OrdinalSales, String>(
charts.Series<OrdinalSales, String>(
id: 'Desktop',
domainFn: (OrdinalSales sales, _) => sales.year,
measureFn: (OrdinalSales sales, _) => sales.sales,
data: desktopSalesData,
),
new charts.Series<OrdinalSales, String>(
charts.Series<OrdinalSales, String>(
id: 'Tablet',
domainFn: (OrdinalSales sales, _) => sales.year,
measureFn: (OrdinalSales sales, _) => sales.sales,
data: tabletSalesData,
),
new charts.Series<OrdinalSales, String>(
charts.Series<OrdinalSales, String>(
id: 'Mobile',
domainFn: (OrdinalSales sales, _) => sales.year,
measureFn: (OrdinalSales sales, _) => sales.sales,
data: mobileSalesData,
),
new charts.Series<OrdinalSales, String>(
charts.Series<OrdinalSales, String>(
id: 'Other',
domainFn: (OrdinalSales sales, _) => sales.year,
measureFn: (OrdinalSales sales, _) => sales.sales,
@@ -126,13 +127,13 @@ class RTLSeriesLegend extends StatelessWidget {
// The below example changes the position to 'start' and max rows of 2 in
// order to show these effects, but are not required for SeriesLegend to
// work with the correct directionality.
return new Directionality(
return Directionality(
textDirection: TextDirection.rtl,
child: new charts.BarChart(
child: charts.BarChart(
seriesList,
animate: animate,
behaviors: [
new charts.SeriesLegend(
charts.SeriesLegend(
position: charts.BehaviorPosition.end, desiredMaxRows: 2)
],
));
@@ -141,53 +142,53 @@ class RTLSeriesLegend extends StatelessWidget {
/// Create series list with multiple series
static List<charts.Series<OrdinalSales, String>> _createSampleData() {
final desktopSalesData = [
new OrdinalSales('2014', 5),
new OrdinalSales('2015', 25),
new OrdinalSales('2016', 100),
new OrdinalSales('2017', 75),
OrdinalSales('2014', 5),
OrdinalSales('2015', 25),
OrdinalSales('2016', 100),
OrdinalSales('2017', 75),
];
final tabletSalesData = [
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),
];
final mobileSalesData = [
new OrdinalSales('2014', 10),
new OrdinalSales('2015', 15),
new OrdinalSales('2016', 50),
new OrdinalSales('2017', 45),
OrdinalSales('2014', 10),
OrdinalSales('2015', 15),
OrdinalSales('2016', 50),
OrdinalSales('2017', 45),
];
final otherSalesData = [
new OrdinalSales('2014', 20),
new OrdinalSales('2015', 35),
new OrdinalSales('2016', 15),
new OrdinalSales('2017', 10),
OrdinalSales('2014', 20),
OrdinalSales('2015', 35),
OrdinalSales('2016', 15),
OrdinalSales('2017', 10),
];
return [
new charts.Series<OrdinalSales, String>(
charts.Series<OrdinalSales, String>(
id: 'Desktop',
domainFn: (OrdinalSales sales, _) => sales.year,
measureFn: (OrdinalSales sales, _) => sales.sales,
data: desktopSalesData,
),
new charts.Series<OrdinalSales, String>(
charts.Series<OrdinalSales, String>(
id: 'Tablet',
domainFn: (OrdinalSales sales, _) => sales.year,
measureFn: (OrdinalSales sales, _) => sales.sales,
data: tabletSalesData,
),
new charts.Series<OrdinalSales, String>(
charts.Series<OrdinalSales, String>(
id: 'Mobile',
domainFn: (OrdinalSales sales, _) => sales.year,
measureFn: (OrdinalSales sales, _) => sales.sales,
data: mobileSalesData,
),
new charts.Series<OrdinalSales, String>(
charts.Series<OrdinalSales, String>(
id: 'Other',
domainFn: (OrdinalSales sales, _) => sales.year,
measureFn: (OrdinalSales sales, _) => sales.sales,