Starter/samples
1
0
Fork 0
mirror of https://github.com/flutter/samples.git synced 2026-04-25 08:22:16 +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

99
web/charts/lib/axes/axes_gallery.dart
View File

@@ -34,104 +34,103 @@ import 'statically_provided_ticks.dart';
List<GalleryScaffold> buildGallery() {
return [
new GalleryScaffold(
listTileIcon: new Icon(Icons.insert_chart),
GalleryScaffold(
listTileIcon: const Icon(Icons.insert_chart),
title: 'Bar chart with Secondary Measure Axis',
subtitle: 'Bar chart with a series using a secondary measure axis',
childBuilder: () => new BarChartWithSecondaryAxis.withRandomData(),
childBuilder: () => BarChartWithSecondaryAxis.withRandomData(),
),
new GalleryScaffold(
listTileIcon: new Icon(Icons.insert_chart),
GalleryScaffold(
listTileIcon: const Icon(Icons.insert_chart),
title: 'Bar chart with Secondary Measure Axis only',
subtitle: 'Bar chart with both series using secondary measure axis',
childBuilder: () => new BarChartWithSecondaryAxisOnly.withRandomData(),
childBuilder: () => BarChartWithSecondaryAxisOnly.withRandomData(),
),
new GalleryScaffold(
listTileIcon: new Transform.rotate(
angle: 1.5708, child: new Icon(Icons.insert_chart)),
GalleryScaffold(
listTileIcon: Transform.rotate(
angle: 1.5708, child: const Icon(Icons.insert_chart)),
title: 'Horizontal bar chart with Secondary Measure Axis',
subtitle:
'Horizontal Bar chart with a series using secondary measure axis',
childBuilder: () =>
new HorizontalBarChartWithSecondaryAxis.withRandomData(),
childBuilder: () => HorizontalBarChartWithSecondaryAxis.withRandomData(),
),
new GalleryScaffold(
listTileIcon: new Icon(Icons.insert_chart),
GalleryScaffold(
listTileIcon: const Icon(Icons.insert_chart),
title: 'Short Ticks Axis',
subtitle: 'Bar chart with the primary measure axis having short ticks',
childBuilder: () => new ShortTickLengthAxis.withRandomData(),
childBuilder: () => ShortTickLengthAxis.withRandomData(),
),
new GalleryScaffold(
listTileIcon: new Icon(Icons.insert_chart),
GalleryScaffold(
listTileIcon: const Icon(Icons.insert_chart),
title: 'Custom Axis Fonts',
subtitle: 'Bar chart with custom axis font size and color',
childBuilder: () => new CustomFontSizeAndColor.withRandomData(),
childBuilder: () => CustomFontSizeAndColor.withRandomData(),
),
new GalleryScaffold(
listTileIcon: new Icon(Icons.insert_chart),
GalleryScaffold(
listTileIcon: const Icon(Icons.insert_chart),
title: 'Label Alignment Axis',
subtitle: 'Bar chart with custom measure axis label alignments',
childBuilder: () => new MeasureAxisLabelAlignment.withRandomData(),
childBuilder: () => MeasureAxisLabelAlignment.withRandomData(),
),
new GalleryScaffold(
listTileIcon: new Icon(Icons.insert_chart),
GalleryScaffold(
listTileIcon: const Icon(Icons.insert_chart),
title: 'No Axis',
subtitle: 'Bar chart with only the axis line drawn',
childBuilder: () => new HiddenTicksAndLabelsAxis.withRandomData(),
childBuilder: () => HiddenTicksAndLabelsAxis.withRandomData(),
),
new GalleryScaffold(
listTileIcon: new Icon(Icons.insert_chart),
GalleryScaffold(
listTileIcon: const Icon(Icons.insert_chart),
title: 'Statically Provided Ticks',
subtitle: 'Bar chart with statically provided ticks',
childBuilder: () => new StaticallyProvidedTicks.withRandomData(),
childBuilder: () => StaticallyProvidedTicks.withRandomData(),
),
new GalleryScaffold(
listTileIcon: new Icon(Icons.show_chart),
GalleryScaffold(
listTileIcon: const Icon(Icons.show_chart),
title: 'Custom Formatter',
subtitle: 'Timeseries with custom domain and measure tick formatters',
childBuilder: () => new CustomAxisTickFormatters.withRandomData(),
childBuilder: () => CustomAxisTickFormatters.withRandomData(),
),
new GalleryScaffold(
listTileIcon: new Icon(Icons.show_chart),
GalleryScaffold(
listTileIcon: const Icon(Icons.show_chart),
title: 'Custom Tick Count',
subtitle: 'Timeseries with custom measure axis tick count',
childBuilder: () => new CustomMeasureTickCount.withRandomData(),
childBuilder: () => CustomMeasureTickCount.withRandomData(),
),
new GalleryScaffold(
listTileIcon: new Icon(Icons.show_chart),
GalleryScaffold(
listTileIcon: const Icon(Icons.show_chart),
title: 'Integer Measure Ticks',
subtitle: 'Timeseries with only whole number measure axis ticks',
childBuilder: () => new IntegerOnlyMeasureAxis.withRandomData(),
childBuilder: () => IntegerOnlyMeasureAxis.withRandomData(),
),
new GalleryScaffold(
listTileIcon: new Icon(Icons.show_chart),
GalleryScaffold(
listTileIcon: const Icon(Icons.show_chart),
title: 'Non-zero bound Axis',
subtitle: 'Timeseries with measure axis that does not include zero',
childBuilder: () => new NonzeroBoundMeasureAxis.withRandomData(),
childBuilder: () => NonzeroBoundMeasureAxis.withRandomData(),
),
new GalleryScaffold(
listTileIcon: new Icon(Icons.insert_chart),
GalleryScaffold(
listTileIcon: const Icon(Icons.insert_chart),
title: 'Ordinal axis with initial viewport',
subtitle: 'Single series with initial viewport',
childBuilder: () => new OrdinalInitialViewport.withRandomData(),
childBuilder: () => OrdinalInitialViewport.withRandomData(),
),
new GalleryScaffold(
listTileIcon: new Icon(Icons.show_chart),
GalleryScaffold(
listTileIcon: const Icon(Icons.show_chart),
title: 'Numeric axis with initial viewport',
subtitle: 'Initial viewport is set to a subset of the data',
childBuilder: () => new NumericInitialViewport.withRandomData(),
childBuilder: () => NumericInitialViewport.withRandomData(),
),
new GalleryScaffold(
listTileIcon: new Icon(Icons.show_chart),
GalleryScaffold(
listTileIcon: const Icon(Icons.show_chart),
title: 'Gridline dash pattern',
subtitle: 'Timeseries with measure gridlines that have a dash pattern',
childBuilder: () => new GridlineDashPattern.withRandomData(),
childBuilder: () => GridlineDashPattern.withRandomData(),
),
new GalleryScaffold(
listTileIcon: new Icon(Icons.show_chart),
GalleryScaffold(
listTileIcon: const Icon(Icons.show_chart),
title: 'Disjoint Measure Axes',
subtitle: 'Line chart with disjoint measure axes',
childBuilder: () => new DisjointMeasureAxisLineChart.withRandomData(),
childBuilder: () => DisjointMeasureAxisLineChart.withRandomData(),
),
];
}

59
web/charts/lib/axes/bar_secondary_axis.dart
View File

@@ -39,10 +39,11 @@ class BarChartWithSecondaryAxis extends StatelessWidget {
final List<charts.Series> seriesList;
final bool animate;
BarChartWithSecondaryAxis(this.seriesList, {this.animate});
const BarChartWithSecondaryAxis(this.seriesList, {this.animate, Key key})
: super(key: key);
factory BarChartWithSecondaryAxis.withSampleData() {
return new BarChartWithSecondaryAxis(
return BarChartWithSecondaryAxis(
_createSampleData(),
// Disable animations for image tests.
animate: false,
@@ -54,35 +55,35 @@ class BarChartWithSecondaryAxis extends StatelessWidget {
// It is used for creating random series data to demonstrate animation in
// the example app only.
factory BarChartWithSecondaryAxis.withRandomData() {
return new BarChartWithSecondaryAxis(_createRandomData());
return BarChartWithSecondaryAxis(_createRandomData());
}
/// Create random data.
static List<charts.Series<OrdinalSales, String>> _createRandomData() {
final random = new Random();
final random = Random();
final globalSalesData = [
new OrdinalSales('2014', random.nextInt(100) * 100),
new OrdinalSales('2015', random.nextInt(100) * 100),
new OrdinalSales('2016', random.nextInt(100) * 100),
new OrdinalSales('2017', random.nextInt(100) * 100),
OrdinalSales('2014', random.nextInt(100) * 100),
OrdinalSales('2015', random.nextInt(100) * 100),
OrdinalSales('2016', random.nextInt(100) * 100),
OrdinalSales('2017', random.nextInt(100) * 100),
];
final losAngelesSalesData = [
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: 'Global Revenue',
domainFn: (OrdinalSales sales, _) => sales.year,
measureFn: (OrdinalSales sales, _) => sales.sales,
data: globalSalesData,
),
new charts.Series<OrdinalSales, String>(
charts.Series<OrdinalSales, String>(
id: 'Los Angeles Revenue',
domainFn: (OrdinalSales sales, _) => sales.year,
measureFn: (OrdinalSales sales, _) => sales.sales,
@@ -97,46 +98,46 @@ class BarChartWithSecondaryAxis extends StatelessWidget {
@override
Widget build(BuildContext context) {
return new charts.BarChart(
return charts.BarChart(
seriesList,
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(
primaryMeasureAxis: const charts.NumericAxisSpec(
tickProviderSpec:
new charts.BasicNumericTickProviderSpec(desiredTickCount: 3)),
secondaryMeasureAxis: new charts.NumericAxisSpec(
charts.BasicNumericTickProviderSpec(desiredTickCount: 3)),
secondaryMeasureAxis: const charts.NumericAxisSpec(
tickProviderSpec:
new charts.BasicNumericTickProviderSpec(desiredTickCount: 3)),
charts.BasicNumericTickProviderSpec(desiredTickCount: 3)),
);
}
/// 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 [
new charts.Series<OrdinalSales, String>(
charts.Series<OrdinalSales, String>(
id: 'Global Revenue',
domainFn: (OrdinalSales sales, _) => sales.year,
measureFn: (OrdinalSales sales, _) => sales.sales,
data: globalSalesData,
),
new charts.Series<OrdinalSales, String>(
charts.Series<OrdinalSales, String>(
id: 'Los Angeles Revenue',
domainFn: (OrdinalSales sales, _) => sales.year,
measureFn: (OrdinalSales sales, _) => sales.sales,

31
web/charts/lib/axes/bar_secondary_axis_only.dart
View File

@@ -33,10 +33,11 @@ class BarChartWithSecondaryAxisOnly extends StatelessWidget {
final List<charts.Series> seriesList;
final bool animate;
BarChartWithSecondaryAxisOnly(this.seriesList, {this.animate});
const BarChartWithSecondaryAxisOnly(this.seriesList, {this.animate, Key key})
: super(key: key);
factory BarChartWithSecondaryAxisOnly.withSampleData() {
return new BarChartWithSecondaryAxisOnly(
return BarChartWithSecondaryAxisOnly(
_createSampleData(),
// Disable animations for image tests.
animate: false,
@@ -48,22 +49,22 @@ class BarChartWithSecondaryAxisOnly extends StatelessWidget {
// It is used for creating random series data to demonstrate animation in
// the example app only.
factory BarChartWithSecondaryAxisOnly.withRandomData() {
return new BarChartWithSecondaryAxisOnly(_createRandomData());
return BarChartWithSecondaryAxisOnly(_createRandomData());
}
/// Create random data.
static List<charts.Series<OrdinalSales, String>> _createRandomData() {
final random = new Random();
final random = Random();
final globalSalesData = [
new OrdinalSales('2014', random.nextInt(100) * 100),
new OrdinalSales('2015', random.nextInt(100) * 100),
new OrdinalSales('2016', random.nextInt(100) * 100),
new OrdinalSales('2017', random.nextInt(100) * 100),
OrdinalSales('2014', random.nextInt(100) * 100),
OrdinalSales('2015', random.nextInt(100) * 100),
OrdinalSales('2016', random.nextInt(100) * 100),
OrdinalSales('2017', random.nextInt(100) * 100),
];
return [
new charts.Series<OrdinalSales, String>(
charts.Series<OrdinalSales, String>(
id: 'Global Revenue',
domainFn: (OrdinalSales sales, _) => sales.year,
measureFn: (OrdinalSales sales, _) => sales.sales,
@@ -77,7 +78,7 @@ class BarChartWithSecondaryAxisOnly extends StatelessWidget {
@override
Widget build(BuildContext context) {
return new charts.BarChart(
return charts.BarChart(
seriesList,
animate: animate,
);
@@ -86,14 +87,14 @@ class BarChartWithSecondaryAxisOnly extends StatelessWidget {
/// Create series list with multiple series
static List<charts.Series<OrdinalSales, String>> _createSampleData() {
final globalSalesData = [
new OrdinalSales('2014', 500),
new OrdinalSales('2015', 2500),
new OrdinalSales('2016', 1000),
new OrdinalSales('2017', 7500),
OrdinalSales('2014', 500),
OrdinalSales('2015', 2500),
OrdinalSales('2016', 1000),
OrdinalSales('2017', 7500),
];
return [
new charts.Series<OrdinalSales, String>(
charts.Series<OrdinalSales, String>(
id: 'Global Revenue',
domainFn: (OrdinalSales sales, _) => sales.year,
measureFn: (OrdinalSales sales, _) => sales.sales,

73
web/charts/lib/axes/custom_axis_tick_formatters.dart
View File

@@ -25,11 +25,12 @@ class CustomAxisTickFormatters extends StatelessWidget {
final List<charts.Series> seriesList;
final bool animate;
CustomAxisTickFormatters(this.seriesList, {this.animate});
const CustomAxisTickFormatters(this.seriesList, {this.animate, Key key})
: super(key: key);
/// Creates a [TimeSeriesChart] with sample data and no transition.
factory CustomAxisTickFormatters.withSampleData() {
return new CustomAxisTickFormatters(
return CustomAxisTickFormatters(
_createSampleData(),
// Disable animations for image tests.
animate: false,
@@ -41,29 +42,29 @@ class CustomAxisTickFormatters extends StatelessWidget {
// It is used for creating random series data to demonstrate animation in
// the example app only.
factory CustomAxisTickFormatters.withRandomData() {
return new CustomAxisTickFormatters(_createRandomData());
return CustomAxisTickFormatters(_createRandomData());
}
/// Create random data.
static List<charts.Series<MyRow, DateTime>> _createRandomData() {
final random = new Random();
final random = Random();
final data = [
new MyRow(new DateTime(2017, 9, 25), random.nextInt(100)),
new MyRow(new DateTime(2017, 9, 26), random.nextInt(100)),
new MyRow(new DateTime(2017, 9, 27), random.nextInt(100)),
new MyRow(new DateTime(2017, 9, 28), random.nextInt(100)),
new MyRow(new DateTime(2017, 9, 29), random.nextInt(100)),
new MyRow(new DateTime(2017, 9, 30), random.nextInt(100)),
new MyRow(new DateTime(2017, 10, 01), random.nextInt(100)),
new MyRow(new DateTime(2017, 10, 02), random.nextInt(100)),
new MyRow(new DateTime(2017, 10, 03), random.nextInt(100)),
new MyRow(new DateTime(2017, 10, 04), random.nextInt(100)),
new MyRow(new DateTime(2017, 10, 05), random.nextInt(100)),
MyRow(DateTime(2017, 9, 25), random.nextInt(100)),
MyRow(DateTime(2017, 9, 26), random.nextInt(100)),
MyRow(DateTime(2017, 9, 27), random.nextInt(100)),
MyRow(DateTime(2017, 9, 28), random.nextInt(100)),
MyRow(DateTime(2017, 9, 29), random.nextInt(100)),
MyRow(DateTime(2017, 9, 30), random.nextInt(100)),
MyRow(DateTime(2017, 10, 01), random.nextInt(100)),
MyRow(DateTime(2017, 10, 02), random.nextInt(100)),
MyRow(DateTime(2017, 10, 03), random.nextInt(100)),
MyRow(DateTime(2017, 10, 04), random.nextInt(100)),
MyRow(DateTime(2017, 10, 05), random.nextInt(100)),
];
return [
new charts.Series<MyRow, DateTime>(
charts.Series<MyRow, DateTime>(
id: 'Cost',
domainFn: (MyRow row, _) => row.timeStamp,
measureFn: (MyRow row, _) => row.cost,
@@ -79,8 +80,8 @@ class CustomAxisTickFormatters extends StatelessWidget {
///
/// This is what is used in the [NumericAxisSpec] below.
final simpleCurrencyFormatter =
new charts.BasicNumericTickFormatterSpec.fromNumberFormat(
new NumberFormat.compactSimpleCurrency());
charts.BasicNumericTickFormatterSpec.fromNumberFormat(
NumberFormat.compactSimpleCurrency());
/// Formatter for numeric ticks that uses the callback provided.
///
@@ -91,11 +92,11 @@ class CustomAxisTickFormatters extends StatelessWidget {
// final customTickFormatter =
// charts.BasicNumericTickFormatterSpec((num value) => 'MyValue: $value');
return new charts.TimeSeriesChart(seriesList,
return charts.TimeSeriesChart(seriesList,
animate: animate,
// Sets up a currency formatter for the measure axis.
primaryMeasureAxis: new charts.NumericAxisSpec(
tickFormatterSpec: simpleCurrencyFormatter),
primaryMeasureAxis:
charts.NumericAxisSpec(tickFormatterSpec: simpleCurrencyFormatter),
/// Customizes the date tick formatter. It will print the day of month
/// as the default format, but include the month and year if it
@@ -103,30 +104,30 @@ class CustomAxisTickFormatters extends StatelessWidget {
///
/// minute, hour, day, month, and year are all provided by default and
/// you can override them following this pattern.
domainAxis: new charts.DateTimeAxisSpec(
tickFormatterSpec: new charts.AutoDateTimeTickFormatterSpec(
day: new charts.TimeFormatterSpec(
domainAxis: const charts.DateTimeAxisSpec(
tickFormatterSpec: charts.AutoDateTimeTickFormatterSpec(
day: charts.TimeFormatterSpec(
format: 'd', transitionFormat: 'MM/dd/yyyy'))));
}
/// Create one series with sample hard coded data.
static List<charts.Series<MyRow, DateTime>> _createSampleData() {
final data = [
new MyRow(new DateTime(2017, 9, 25), 6),
new MyRow(new DateTime(2017, 9, 26), 8),
new MyRow(new DateTime(2017, 9, 27), 6),
new MyRow(new DateTime(2017, 9, 28), 9),
new MyRow(new DateTime(2017, 9, 29), 11),
new MyRow(new DateTime(2017, 9, 30), 15),
new MyRow(new DateTime(2017, 10, 01), 25),
new MyRow(new DateTime(2017, 10, 02), 33),
new MyRow(new DateTime(2017, 10, 03), 27),
new MyRow(new DateTime(2017, 10, 04), 31),
new MyRow(new DateTime(2017, 10, 05), 23),
MyRow(DateTime(2017, 9, 25), 6),
MyRow(DateTime(2017, 9, 26), 8),
MyRow(DateTime(2017, 9, 27), 6),
MyRow(DateTime(2017, 9, 28), 9),
MyRow(DateTime(2017, 9, 29), 11),
MyRow(DateTime(2017, 9, 30), 15),
MyRow(DateTime(2017, 10, 01), 25),
MyRow(DateTime(2017, 10, 02), 33),
MyRow(DateTime(2017, 10, 03), 27),
MyRow(DateTime(2017, 10, 04), 31),
MyRow(DateTime(2017, 10, 05), 23),
];
return [
new charts.Series<MyRow, DateTime>(
charts.Series<MyRow, DateTime>(
id: 'Cost',
domainFn: (MyRow row, _) => row.timeStamp,
measureFn: (MyRow row, _) => row.cost,

51
web/charts/lib/axes/custom_font_size_and_color.dart
View File

@@ -29,10 +29,11 @@ class CustomFontSizeAndColor extends StatelessWidget {
final List<charts.Series> seriesList;
final bool animate;
CustomFontSizeAndColor(this.seriesList, {this.animate});
const CustomFontSizeAndColor(this.seriesList, {this.animate, Key key})
: super(key: key);
factory CustomFontSizeAndColor.withSampleData() {
return new CustomFontSizeAndColor(
return CustomFontSizeAndColor(
_createSampleData(),
// Disable animations for image tests.
animate: false,
@@ -44,22 +45,22 @@ class CustomFontSizeAndColor extends StatelessWidget {
// It is used for creating random series data to demonstrate animation in
// the example app only.
factory CustomFontSizeAndColor.withRandomData() {
return new CustomFontSizeAndColor(_createRandomData());
return CustomFontSizeAndColor(_createRandomData());
}
/// Create random data.
static List<charts.Series<OrdinalSales, String>> _createRandomData() {
final random = new Random();
final random = Random();
final globalSalesData = [
new OrdinalSales('2014', random.nextInt(100) * 100),
new OrdinalSales('2015', random.nextInt(100) * 100),
new OrdinalSales('2016', random.nextInt(100) * 100),
new OrdinalSales('2017', random.nextInt(100) * 100),
OrdinalSales('2014', random.nextInt(100) * 100),
OrdinalSales('2015', random.nextInt(100) * 100),
OrdinalSales('2016', random.nextInt(100) * 100),
OrdinalSales('2017', random.nextInt(100) * 100),
];
return [
new charts.Series<OrdinalSales, String>(
charts.Series<OrdinalSales, String>(
id: 'Global Revenue',
domainFn: (OrdinalSales sales, _) => sales.year,
measureFn: (OrdinalSales sales, _) => sales.sales,
@@ -71,7 +72,7 @@ class CustomFontSizeAndColor extends StatelessWidget {
@override
Widget build(BuildContext context) {
return new charts.BarChart(
return charts.BarChart(
seriesList,
animate: animate,
@@ -80,44 +81,44 @@ class CustomFontSizeAndColor extends StatelessWidget {
/// This is an OrdinalAxisSpec to match up with BarChart's default
/// ordinal domain axis (use NumericAxisSpec or DateTimeAxisSpec for
/// other charts).
domainAxis: new charts.OrdinalAxisSpec(
renderSpec: new charts.SmallTickRendererSpec(
domainAxis: const charts.OrdinalAxisSpec(
renderSpec: charts.SmallTickRendererSpec(
// Tick and Label styling here.
labelStyle: new charts.TextStyleSpec(
labelStyle: charts.TextStyleSpec(
fontSize: 18, // size in Pts.
color: charts.MaterialPalette.black),
// Change the line colors to match text color.
lineStyle: new charts.LineStyleSpec(
color: charts.MaterialPalette.black))),
lineStyle:
charts.LineStyleSpec(color: charts.MaterialPalette.black))),
/// Assign a custom style for the measure axis.
primaryMeasureAxis: new charts.NumericAxisSpec(
renderSpec: new charts.GridlineRendererSpec(
primaryMeasureAxis: const charts.NumericAxisSpec(
renderSpec: charts.GridlineRendererSpec(
// Tick and Label styling here.
labelStyle: new charts.TextStyleSpec(
labelStyle: charts.TextStyleSpec(
fontSize: 18, // size in Pts.
color: charts.MaterialPalette.black),
// Change the line colors to match text color.
lineStyle: new charts.LineStyleSpec(
color: charts.MaterialPalette.black))),
lineStyle:
charts.LineStyleSpec(color: charts.MaterialPalette.black))),
);
}
/// Create series list with single 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),
];
return [
new charts.Series<OrdinalSales, String>(
charts.Series<OrdinalSales, String>(
id: 'Global Revenue',
domainFn: (OrdinalSales sales, _) => sales.year,
measureFn: (OrdinalSales sales, _) => sales.sales,

63
web/charts/lib/axes/custom_measure_tick_count.dart
View File

@@ -28,11 +28,12 @@ class CustomMeasureTickCount extends StatelessWidget {
final List<charts.Series> seriesList;
final bool animate;
CustomMeasureTickCount(this.seriesList, {this.animate});
const CustomMeasureTickCount(this.seriesList, {this.animate, Key key})
: super(key: key);
/// Creates a [TimeSeriesChart] with sample data and no transition.
factory CustomMeasureTickCount.withSampleData() {
return new CustomMeasureTickCount(
return CustomMeasureTickCount(
_createSampleData(),
// Disable animations for image tests.
animate: false,
@@ -44,29 +45,29 @@ class CustomMeasureTickCount extends StatelessWidget {
// It is used for creating random series data to demonstrate animation in
// the example app only.
factory CustomMeasureTickCount.withRandomData() {
return new CustomMeasureTickCount(_createRandomData());
return CustomMeasureTickCount(_createRandomData());
}
/// Create random data.
static List<charts.Series<MyRow, DateTime>> _createRandomData() {
final random = new Random();
final random = Random();
final data = [
new MyRow(new DateTime(2017, 9, 25), random.nextInt(100)),
new MyRow(new DateTime(2017, 9, 26), random.nextInt(100)),
new MyRow(new DateTime(2017, 9, 27), random.nextInt(100)),
new MyRow(new DateTime(2017, 9, 28), random.nextInt(100)),
new MyRow(new DateTime(2017, 9, 29), random.nextInt(100)),
new MyRow(new DateTime(2017, 9, 30), random.nextInt(100)),
new MyRow(new DateTime(2017, 10, 01), random.nextInt(100)),
new MyRow(new DateTime(2017, 10, 02), random.nextInt(100)),
new MyRow(new DateTime(2017, 10, 03), random.nextInt(100)),
new MyRow(new DateTime(2017, 10, 04), random.nextInt(100)),
new MyRow(new DateTime(2017, 10, 05), random.nextInt(100)),
MyRow(DateTime(2017, 9, 25), random.nextInt(100)),
MyRow(DateTime(2017, 9, 26), random.nextInt(100)),
MyRow(DateTime(2017, 9, 27), random.nextInt(100)),
MyRow(DateTime(2017, 9, 28), random.nextInt(100)),
MyRow(DateTime(2017, 9, 29), random.nextInt(100)),
MyRow(DateTime(2017, 9, 30), random.nextInt(100)),
MyRow(DateTime(2017, 10, 01), random.nextInt(100)),
MyRow(DateTime(2017, 10, 02), random.nextInt(100)),
MyRow(DateTime(2017, 10, 03), random.nextInt(100)),
MyRow(DateTime(2017, 10, 04), random.nextInt(100)),
MyRow(DateTime(2017, 10, 05), random.nextInt(100)),
];
return [
new charts.Series<MyRow, DateTime>(
charts.Series<MyRow, DateTime>(
id: 'Cost',
domainFn: (MyRow row, _) => row.timeStamp,
measureFn: (MyRow row, _) => row.cost,
@@ -78,33 +79,33 @@ class CustomMeasureTickCount extends StatelessWidget {
@override
Widget build(BuildContext context) {
return new charts.TimeSeriesChart(seriesList,
return charts.TimeSeriesChart(seriesList,
animate: animate,
/// Customize the measure axis to have 2 ticks,
primaryMeasureAxis: new charts.NumericAxisSpec(
primaryMeasureAxis: const charts.NumericAxisSpec(
tickProviderSpec:
new charts.BasicNumericTickProviderSpec(desiredTickCount: 2)));
charts.BasicNumericTickProviderSpec(desiredTickCount: 2)));
}
/// Create one series with sample hard coded data.
static List<charts.Series<MyRow, DateTime>> _createSampleData() {
final data = [
new MyRow(new DateTime(2017, 9, 25), 6),
new MyRow(new DateTime(2017, 9, 26), 8),
new MyRow(new DateTime(2017, 9, 27), 6),
new MyRow(new DateTime(2017, 9, 28), 9),
new MyRow(new DateTime(2017, 9, 29), 11),
new MyRow(new DateTime(2017, 9, 30), 15),
new MyRow(new DateTime(2017, 10, 01), 25),
new MyRow(new DateTime(2017, 10, 02), 33),
new MyRow(new DateTime(2017, 10, 03), 27),
new MyRow(new DateTime(2017, 10, 04), 31),
new MyRow(new DateTime(2017, 10, 05), 23),
MyRow(DateTime(2017, 9, 25), 6),
MyRow(DateTime(2017, 9, 26), 8),
MyRow(DateTime(2017, 9, 27), 6),
MyRow(DateTime(2017, 9, 28), 9),
MyRow(DateTime(2017, 9, 29), 11),
MyRow(DateTime(2017, 9, 30), 15),
MyRow(DateTime(2017, 10, 01), 25),
MyRow(DateTime(2017, 10, 02), 33),
MyRow(DateTime(2017, 10, 03), 27),
MyRow(DateTime(2017, 10, 04), 31),
MyRow(DateTime(2017, 10, 05), 23),
];
return [
new charts.Series<MyRow, DateTime>(
charts.Series<MyRow, DateTime>(
id: 'Cost',
domainFn: (MyRow row, _) => row.timeStamp,
measureFn: (MyRow row, _) => row.cost,

31
web/charts/lib/axes/flipped_vertical_axis.dart
View File

@@ -32,10 +32,11 @@ class FlippedVerticalAxis extends StatelessWidget {
final List<charts.Series> seriesList;
final bool animate;
FlippedVerticalAxis(this.seriesList, {this.animate});
const FlippedVerticalAxis(this.seriesList, {this.animate, Key key})
: super(key: key);
factory FlippedVerticalAxis.withSampleData() {
return new FlippedVerticalAxis(
return FlippedVerticalAxis(
_createSampleData(),
// Disable animations for image tests.
animate: false,
@@ -47,25 +48,25 @@ class FlippedVerticalAxis extends StatelessWidget {
// It is used for creating random series data to demonstrate animation in
// the example app only.
factory FlippedVerticalAxis.withRandomData() {
return new FlippedVerticalAxis(_createRandomData());
return FlippedVerticalAxis(_createRandomData());
}
/// Create random data.
static List<charts.Series<RunnerRank, String>> _createRandomData() {
final random = new Random();
final random = Random();
const runners = ['Smith', 'Jones', 'Brown', 'Doe'];
// Randomly assign runners, but leave the order of the places.
final raceData = [
new RunnerRank(runners.removeAt(random.nextInt(runners.length)), 1),
new RunnerRank(runners.removeAt(random.nextInt(runners.length)), 2),
new RunnerRank(runners.removeAt(random.nextInt(runners.length)), 3),
new RunnerRank(runners.removeAt(random.nextInt(runners.length)), 4),
RunnerRank(runners.removeAt(random.nextInt(runners.length)), 1),
RunnerRank(runners.removeAt(random.nextInt(runners.length)), 2),
RunnerRank(runners.removeAt(random.nextInt(runners.length)), 3),
RunnerRank(runners.removeAt(random.nextInt(runners.length)), 4),
];
return [
new charts.Series<RunnerRank, String>(
charts.Series<RunnerRank, String>(
id: 'Race Results',
domainFn: (RunnerRank row, _) => row.name,
measureFn: (RunnerRank row, _) => row.place,
@@ -80,7 +81,7 @@ class FlippedVerticalAxis extends StatelessWidget {
// TODO: Remove this comment
@override
Widget build(BuildContext context) {
return new charts.BarChart(
return charts.BarChart(
seriesList,
animate: animate,
flipVerticalAxis: true,
@@ -90,14 +91,14 @@ class FlippedVerticalAxis extends StatelessWidget {
/// Create series list with multiple series
static List<charts.Series<RunnerRank, String>> _createSampleData() {
final raceData = [
new RunnerRank('Smith', 1),
new RunnerRank('Jones', 2),
new RunnerRank('Brown', 3),
new RunnerRank('Doe', 4),
RunnerRank('Smith', 1),
RunnerRank('Jones', 2),
RunnerRank('Brown', 3),
RunnerRank('Doe', 4),
];
return [
new charts.Series<RunnerRank, String>(
charts.Series<RunnerRank, String>(
id: 'Race Results',
domainFn: (RunnerRank row, _) => row.name,
measureFn: (RunnerRank row, _) => row.place,

61
web/charts/lib/axes/gridline_dash_pattern.dart
View File

@@ -24,11 +24,12 @@ class GridlineDashPattern extends StatelessWidget {
final List<charts.Series> seriesList;
final bool animate;
GridlineDashPattern(this.seriesList, {this.animate});
const GridlineDashPattern(this.seriesList, {this.animate, Key key})
: super(key: key);
/// Creates a [TimeSeriesChart] with sample data and no transition.
factory GridlineDashPattern.withSampleData() {
return new GridlineDashPattern(
return GridlineDashPattern(
_createSampleData(),
// Disable animations for image tests.
animate: false,
@@ -40,29 +41,29 @@ class GridlineDashPattern extends StatelessWidget {
// It is used for creating random series data to demonstrate animation in
// the example app only.
factory GridlineDashPattern.withRandomData() {
return new GridlineDashPattern(_createRandomData());
return GridlineDashPattern(_createRandomData());
}
/// Create random data.
static List<charts.Series<MyRow, DateTime>> _createRandomData() {
final random = new Random();
final random = Random();
final data = [
new MyRow(new DateTime(2017, 9, 25), random.nextInt(100)),
new MyRow(new DateTime(2017, 9, 26), random.nextInt(100)),
new MyRow(new DateTime(2017, 9, 27), random.nextInt(100)),
new MyRow(new DateTime(2017, 9, 28), random.nextInt(100)),
new MyRow(new DateTime(2017, 9, 29), random.nextInt(100)),
new MyRow(new DateTime(2017, 9, 30), random.nextInt(100)),
new MyRow(new DateTime(2017, 10, 01), random.nextInt(100)),
new MyRow(new DateTime(2017, 10, 02), random.nextInt(100)),
new MyRow(new DateTime(2017, 10, 03), random.nextInt(100)),
new MyRow(new DateTime(2017, 10, 04), random.nextInt(100)),
new MyRow(new DateTime(2017, 10, 05), random.nextInt(100)),
MyRow(DateTime(2017, 9, 25), random.nextInt(100)),
MyRow(DateTime(2017, 9, 26), random.nextInt(100)),
MyRow(DateTime(2017, 9, 27), random.nextInt(100)),
MyRow(DateTime(2017, 9, 28), random.nextInt(100)),
MyRow(DateTime(2017, 9, 29), random.nextInt(100)),
MyRow(DateTime(2017, 9, 30), random.nextInt(100)),
MyRow(DateTime(2017, 10, 01), random.nextInt(100)),
MyRow(DateTime(2017, 10, 02), random.nextInt(100)),
MyRow(DateTime(2017, 10, 03), random.nextInt(100)),
MyRow(DateTime(2017, 10, 04), random.nextInt(100)),
MyRow(DateTime(2017, 10, 05), random.nextInt(100)),
];
return [
new charts.Series<MyRow, DateTime>(
charts.Series<MyRow, DateTime>(
id: 'Cost',
domainFn: (MyRow row, _) => row.timeStamp,
measureFn: (MyRow row, _) => row.cost,
@@ -74,11 +75,11 @@ class GridlineDashPattern extends StatelessWidget {
@override
Widget build(BuildContext context) {
return new charts.TimeSeriesChart(seriesList,
return charts.TimeSeriesChart(seriesList,
animate: animate,
/// Customize the gridlines to use a dash pattern.
primaryMeasureAxis: new charts.NumericAxisSpec(
primaryMeasureAxis: const charts.NumericAxisSpec(
renderSpec: charts.GridlineRendererSpec(
lineStyle: charts.LineStyleSpec(
dashPattern: [4, 4],
@@ -88,21 +89,21 @@ class GridlineDashPattern extends StatelessWidget {
/// Create one series with sample hard coded data.
static List<charts.Series<MyRow, DateTime>> _createSampleData() {
final data = [
new MyRow(new DateTime(2017, 9, 25), 6),
new MyRow(new DateTime(2017, 9, 26), 8),
new MyRow(new DateTime(2017, 9, 27), 6),
new MyRow(new DateTime(2017, 9, 28), 9),
new MyRow(new DateTime(2017, 9, 29), 11),
new MyRow(new DateTime(2017, 9, 30), 15),
new MyRow(new DateTime(2017, 10, 01), 25),
new MyRow(new DateTime(2017, 10, 02), 33),
new MyRow(new DateTime(2017, 10, 03), 27),
new MyRow(new DateTime(2017, 10, 04), 31),
new MyRow(new DateTime(2017, 10, 05), 23),
MyRow(DateTime(2017, 9, 25), 6),
MyRow(DateTime(2017, 9, 26), 8),
MyRow(DateTime(2017, 9, 27), 6),
MyRow(DateTime(2017, 9, 28), 9),
MyRow(DateTime(2017, 9, 29), 11),
MyRow(DateTime(2017, 9, 30), 15),
MyRow(DateTime(2017, 10, 01), 25),
MyRow(DateTime(2017, 10, 02), 33),
MyRow(DateTime(2017, 10, 03), 27),
MyRow(DateTime(2017, 10, 04), 31),
MyRow(DateTime(2017, 10, 05), 23),
];
return [
new charts.Series<MyRow, DateTime>(
charts.Series<MyRow, DateTime>(
id: 'Cost',
domainFn: (MyRow row, _) => row.timeStamp,
measureFn: (MyRow row, _) => row.cost,

37
web/charts/lib/axes/hidden_ticks_and_labels_axis.dart
View File

@@ -25,10 +25,11 @@ class HiddenTicksAndLabelsAxis extends StatelessWidget {
final List<charts.Series> seriesList;
final bool animate;
HiddenTicksAndLabelsAxis(this.seriesList, {this.animate});
const HiddenTicksAndLabelsAxis(this.seriesList, {this.animate, Key key})
: super(key: key);
factory HiddenTicksAndLabelsAxis.withSampleData() {
return new HiddenTicksAndLabelsAxis(
return HiddenTicksAndLabelsAxis(
_createSampleData(),
// Disable animations for image tests.
animate: false,
@@ -40,22 +41,22 @@ class HiddenTicksAndLabelsAxis extends StatelessWidget {
// It is used for creating random series data to demonstrate animation in
// the example app only.
factory HiddenTicksAndLabelsAxis.withRandomData() {
return new HiddenTicksAndLabelsAxis(_createRandomData());
return HiddenTicksAndLabelsAxis(_createRandomData());
}
/// Create random data.
static List<charts.Series<OrdinalSales, String>> _createRandomData() {
final random = new Random();
final random = Random();
final globalSalesData = [
new OrdinalSales('2014', random.nextInt(100) * 100),
new OrdinalSales('2015', random.nextInt(100) * 100),
new OrdinalSales('2016', random.nextInt(100) * 100),
new OrdinalSales('2017', random.nextInt(100) * 100),
OrdinalSales('2014', random.nextInt(100) * 100),
OrdinalSales('2015', random.nextInt(100) * 100),
OrdinalSales('2016', random.nextInt(100) * 100),
OrdinalSales('2017', random.nextInt(100) * 100),
];
return [
new charts.Series<OrdinalSales, String>(
charts.Series<OrdinalSales, String>(
id: 'Global Revenue',
domainFn: (OrdinalSales sales, _) => sales.year,
measureFn: (OrdinalSales sales, _) => sales.sales,
@@ -67,7 +68,7 @@ class HiddenTicksAndLabelsAxis extends StatelessWidget {
@override
Widget build(BuildContext context) {
return new charts.BarChart(
return charts.BarChart(
seriesList,
animate: animate,
@@ -76,30 +77,30 @@ class HiddenTicksAndLabelsAxis extends StatelessWidget {
/// The NoneRenderSpec can still draw an axis line with
/// showAxisLine=true.
primaryMeasureAxis:
new charts.NumericAxisSpec(renderSpec: new charts.NoneRenderSpec()),
const charts.NumericAxisSpec(renderSpec: charts.NoneRenderSpec()),
/// This is an OrdinalAxisSpec to match up with BarChart's default
/// ordinal domain axis (use NumericAxisSpec or DateTimeAxisSpec for
/// other charts).
domainAxis: new charts.OrdinalAxisSpec(
domainAxis: const charts.OrdinalAxisSpec(
// Make sure that we draw the domain axis line.
showAxisLine: true,
// But don't draw anything else.
renderSpec: new charts.NoneRenderSpec()),
renderSpec: charts.NoneRenderSpec()),
);
}
/// Create series list with single 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),
];
return [
new charts.Series<OrdinalSales, String>(
charts.Series<OrdinalSales, String>(
id: 'Global Revenue',
domainFn: (OrdinalSales sales, _) => sales.year,
measureFn: (OrdinalSales sales, _) => sales.sales,

60
web/charts/lib/axes/horizontal_bar_secondary_axis.dart
View File

@@ -39,10 +39,12 @@ class HorizontalBarChartWithSecondaryAxis extends StatelessWidget {
final List<charts.Series> seriesList;
final bool animate;
HorizontalBarChartWithSecondaryAxis(this.seriesList, {this.animate});
const HorizontalBarChartWithSecondaryAxis(this.seriesList,
{this.animate, Key key})
: super(key: key);
factory HorizontalBarChartWithSecondaryAxis.withSampleData() {
return new HorizontalBarChartWithSecondaryAxis(
return HorizontalBarChartWithSecondaryAxis(
_createSampleData(),
// Disable animations for image tests.
animate: false,
@@ -54,35 +56,35 @@ class HorizontalBarChartWithSecondaryAxis extends StatelessWidget {
// It is used for creating random series data to demonstrate animation in
// the example app only.
factory HorizontalBarChartWithSecondaryAxis.withRandomData() {
return new HorizontalBarChartWithSecondaryAxis(_createRandomData());
return HorizontalBarChartWithSecondaryAxis(_createRandomData());
}
/// Create random data.
static List<charts.Series<OrdinalSales, String>> _createRandomData() {
final random = new Random();
final random = Random();
final globalSalesData = [
new OrdinalSales('2014', random.nextInt(100) * 100),
new OrdinalSales('2015', random.nextInt(100) * 100),
new OrdinalSales('2016', random.nextInt(100) * 100),
new OrdinalSales('2017', random.nextInt(100) * 100),
OrdinalSales('2014', random.nextInt(100) * 100),
OrdinalSales('2015', random.nextInt(100) * 100),
OrdinalSales('2016', random.nextInt(100) * 100),
OrdinalSales('2017', random.nextInt(100) * 100),
];
final losAngelesSalesData = [
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: 'Global Revenue',
domainFn: (OrdinalSales sales, _) => sales.year,
measureFn: (OrdinalSales sales, _) => sales.sales,
data: globalSalesData,
),
new charts.Series<OrdinalSales, String>(
charts.Series<OrdinalSales, String>(
id: 'Los Angeles Revenue',
domainFn: (OrdinalSales sales, _) => sales.year,
measureFn: (OrdinalSales sales, _) => sales.sales,
@@ -98,7 +100,7 @@ class HorizontalBarChartWithSecondaryAxis extends StatelessWidget {
@override
Widget build(BuildContext context) {
// For horizontal bar charts, set the [vertical] flag to false.
return new charts.BarChart(
return charts.BarChart(
seriesList,
animate: animate,
barGroupingType: charts.BarGroupingType.grouped,
@@ -106,39 +108,39 @@ class HorizontalBarChartWithSecondaryAxis extends StatelessWidget {
// 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(
primaryMeasureAxis: const charts.NumericAxisSpec(
tickProviderSpec:
new charts.BasicNumericTickProviderSpec(desiredTickCount: 3)),
secondaryMeasureAxis: new charts.NumericAxisSpec(
charts.BasicNumericTickProviderSpec(desiredTickCount: 3)),
secondaryMeasureAxis: const charts.NumericAxisSpec(
tickProviderSpec:
new charts.BasicNumericTickProviderSpec(desiredTickCount: 3)),
charts.BasicNumericTickProviderSpec(desiredTickCount: 3)),
);
}
/// 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 [
new charts.Series<OrdinalSales, String>(
charts.Series<OrdinalSales, String>(
id: 'Global Revenue',
domainFn: (OrdinalSales sales, _) => sales.year,
measureFn: (OrdinalSales sales, _) => sales.sales,
data: globalSalesData,
),
new charts.Series<OrdinalSales, String>(
charts.Series<OrdinalSales, String>(
id: 'Los Angeles Revenue',
domainFn: (OrdinalSales sales, _) => sales.year,
measureFn: (OrdinalSales sales, _) => sales.sales,

63
web/charts/lib/axes/integer_only_measure_axis.dart
View File

@@ -29,11 +29,12 @@ class IntegerOnlyMeasureAxis extends StatelessWidget {
final List<charts.Series> seriesList;
final bool animate;
IntegerOnlyMeasureAxis(this.seriesList, {this.animate});
const IntegerOnlyMeasureAxis(this.seriesList, {this.animate, Key key})
: super(key: key);
/// Creates a [TimeSeriesChart] with sample data and no transition.
factory IntegerOnlyMeasureAxis.withSampleData() {
return new IntegerOnlyMeasureAxis(
return IntegerOnlyMeasureAxis(
_createSampleData(),
// Disable animations for image tests.
animate: false,
@@ -45,29 +46,29 @@ class IntegerOnlyMeasureAxis extends StatelessWidget {
// It is used for creating random series data to demonstrate animation in
// the example app only.
factory IntegerOnlyMeasureAxis.withRandomData() {
return new IntegerOnlyMeasureAxis(_createRandomData());
return IntegerOnlyMeasureAxis(_createRandomData());
}
/// Create random data.
static List<charts.Series<MyRow, DateTime>> _createRandomData() {
final random = new Random();
final random = Random();
final data = [
new MyRow(new DateTime(2017, 9, 25), random.nextDouble().round()),
new MyRow(new DateTime(2017, 9, 26), random.nextDouble().round()),
new MyRow(new DateTime(2017, 9, 27), random.nextDouble().round()),
new MyRow(new DateTime(2017, 9, 28), random.nextDouble().round()),
new MyRow(new DateTime(2017, 9, 29), random.nextDouble().round()),
new MyRow(new DateTime(2017, 9, 30), random.nextDouble().round()),
new MyRow(new DateTime(2017, 10, 01), random.nextDouble().round()),
new MyRow(new DateTime(2017, 10, 02), random.nextDouble().round()),
new MyRow(new DateTime(2017, 10, 03), random.nextDouble().round()),
new MyRow(new DateTime(2017, 10, 04), random.nextDouble().round()),
new MyRow(new DateTime(2017, 10, 05), random.nextDouble().round()),
MyRow(DateTime(2017, 9, 25), random.nextDouble().round()),
MyRow(DateTime(2017, 9, 26), random.nextDouble().round()),
MyRow(DateTime(2017, 9, 27), random.nextDouble().round()),
MyRow(DateTime(2017, 9, 28), random.nextDouble().round()),
MyRow(DateTime(2017, 9, 29), random.nextDouble().round()),
MyRow(DateTime(2017, 9, 30), random.nextDouble().round()),
MyRow(DateTime(2017, 10, 01), random.nextDouble().round()),
MyRow(DateTime(2017, 10, 02), random.nextDouble().round()),
MyRow(DateTime(2017, 10, 03), random.nextDouble().round()),
MyRow(DateTime(2017, 10, 04), random.nextDouble().round()),
MyRow(DateTime(2017, 10, 05), random.nextDouble().round()),
];
return [
new charts.Series<MyRow, DateTime>(
charts.Series<MyRow, DateTime>(
id: 'Headcount',
domainFn: (MyRow row, _) => row.timeStamp,
measureFn: (MyRow row, _) => row.headcount,
@@ -79,12 +80,12 @@ class IntegerOnlyMeasureAxis extends StatelessWidget {
@override
Widget build(BuildContext context) {
return new charts.TimeSeriesChart(
return charts.TimeSeriesChart(
seriesList,
animate: animate,
// Provides a custom axis ensuring that the ticks are in whole numbers.
primaryMeasureAxis: new charts.NumericAxisSpec(
tickProviderSpec: new charts.BasicNumericTickProviderSpec(
primaryMeasureAxis: const charts.NumericAxisSpec(
tickProviderSpec: charts.BasicNumericTickProviderSpec(
// Make sure we don't have values less than 1 as ticks
// (ie: counts).
dataIsInWholeNumbers: true,
@@ -97,21 +98,21 @@ class IntegerOnlyMeasureAxis extends StatelessWidget {
/// Create one series with sample hard coded data.
static List<charts.Series<MyRow, DateTime>> _createSampleData() {
final data = [
new MyRow(new DateTime(2017, 9, 25), 0),
new MyRow(new DateTime(2017, 9, 26), 0),
new MyRow(new DateTime(2017, 9, 27), 0),
new MyRow(new DateTime(2017, 9, 28), 0),
new MyRow(new DateTime(2017, 9, 29), 0),
new MyRow(new DateTime(2017, 9, 30), 0),
new MyRow(new DateTime(2017, 10, 01), 1),
new MyRow(new DateTime(2017, 10, 02), 1),
new MyRow(new DateTime(2017, 10, 03), 1),
new MyRow(new DateTime(2017, 10, 04), 1),
new MyRow(new DateTime(2017, 10, 05), 1),
MyRow(DateTime(2017, 9, 25), 0),
MyRow(DateTime(2017, 9, 26), 0),
MyRow(DateTime(2017, 9, 27), 0),
MyRow(DateTime(2017, 9, 28), 0),
MyRow(DateTime(2017, 9, 29), 0),
MyRow(DateTime(2017, 9, 30), 0),
MyRow(DateTime(2017, 10, 01), 1),
MyRow(DateTime(2017, 10, 02), 1),
MyRow(DateTime(2017, 10, 03), 1),
MyRow(DateTime(2017, 10, 04), 1),
MyRow(DateTime(2017, 10, 05), 1),
];
return [
new charts.Series<MyRow, DateTime>(
charts.Series<MyRow, DateTime>(
id: 'Headcount',
domainFn: (MyRow row, _) => row.timeStamp,
measureFn: (MyRow row, _) => row.headcount,

119
web/charts/lib/axes/line_disjoint_axis.dart
View File

@@ -31,11 +31,12 @@ class DisjointMeasureAxisLineChart extends StatelessWidget {
final List<charts.Series> seriesList;
final bool animate;
DisjointMeasureAxisLineChart(this.seriesList, {this.animate});
const DisjointMeasureAxisLineChart(this.seriesList, {this.animate, Key key})
: super(key: key);
/// Creates a [LineChart] with sample data and no transition.
factory DisjointMeasureAxisLineChart.withSampleData() {
return new DisjointMeasureAxisLineChart(
return DisjointMeasureAxisLineChart(
_createSampleData(),
// Disable animations for image tests.
animate: false,
@@ -47,58 +48,58 @@ class DisjointMeasureAxisLineChart extends StatelessWidget {
// It is used for creating random series data to demonstrate animation in
// the example app only.
factory DisjointMeasureAxisLineChart.withRandomData() {
return new DisjointMeasureAxisLineChart(_createRandomData());
return DisjointMeasureAxisLineChart(_createRandomData());
}
/// Create random data.
static List<charts.Series<LinearClicks, num>> _createRandomData() {
final random = new Random();
final random = Random();
// The first three series contain similar data with different magnitudes.
// This demonstrates the ability to graph the trends in each series relative
// to each other, without the largest magnitude series compressing the
// smallest.
final myFakeDesktopData = [
new LinearClicks(0, clickCount: random.nextInt(100)),
new LinearClicks(1, clickCount: random.nextInt(100)),
new LinearClicks(2, clickCount: random.nextInt(100)),
new LinearClicks(3, clickCount: random.nextInt(100)),
LinearClicks(0, clickCount: random.nextInt(100)),
LinearClicks(1, clickCount: random.nextInt(100)),
LinearClicks(2, clickCount: random.nextInt(100)),
LinearClicks(3, clickCount: random.nextInt(100)),
];
final myFakeTabletData = [
new LinearClicks(0, clickCount: random.nextInt(100) * 100),
new LinearClicks(1, clickCount: random.nextInt(100) * 100),
new LinearClicks(2, clickCount: random.nextInt(100) * 100),
new LinearClicks(3, clickCount: random.nextInt(100) * 100),
LinearClicks(0, clickCount: random.nextInt(100) * 100),
LinearClicks(1, clickCount: random.nextInt(100) * 100),
LinearClicks(2, clickCount: random.nextInt(100) * 100),
LinearClicks(3, clickCount: random.nextInt(100) * 100),
];
final myFakeMobileData = [
new LinearClicks(0, clickCount: random.nextInt(100) * 1000),
new LinearClicks(1, clickCount: random.nextInt(100) * 1000),
new LinearClicks(2, clickCount: random.nextInt(100) * 1000),
new LinearClicks(3, clickCount: random.nextInt(100) * 1000),
LinearClicks(0, clickCount: random.nextInt(100) * 1000),
LinearClicks(1, clickCount: random.nextInt(100) * 1000),
LinearClicks(2, clickCount: random.nextInt(100) * 1000),
LinearClicks(3, clickCount: random.nextInt(100) * 1000),
];
// The fourth series renders with decimal values, representing a very
// different sort ratio-based data. If this was on the same axis as any of
// the other series, it would be squashed near zero.
final myFakeClickRateData = [
new LinearClicks(0, clickRate: .25),
new LinearClicks(1, clickRate: .65),
new LinearClicks(2, clickRate: .50),
new LinearClicks(3, clickRate: .30),
LinearClicks(0, clickRate: .25),
LinearClicks(1, clickRate: .65),
LinearClicks(2, clickRate: .50),
LinearClicks(3, clickRate: .30),
];
return [
// We render an empty series on the primary measure axis to ensure that
// the axis itself gets rendered. This helps us draw the gridlines on the
// chart.
new charts.Series<LinearClicks, int>(
charts.Series<LinearClicks, int>(
id: 'Fake Series',
domainFn: (LinearClicks clickCount, _) => clickCount.year,
measureFn: (LinearClicks clickCount, _) => clickCount.clickCount,
data: []),
new charts.Series<LinearClicks, int>(
charts.Series<LinearClicks, int>(
id: 'Desktop',
colorFn: (_, __) => charts.MaterialPalette.blue.shadeDefault,
domainFn: (LinearClicks clickCount, _) => clickCount.year,
@@ -107,7 +108,7 @@ class DisjointMeasureAxisLineChart extends StatelessWidget {
)
// Set the 'Desktop' series to use a disjoint axis.
..setAttribute(charts.measureAxisIdKey, 'axis 1'),
new charts.Series<LinearClicks, int>(
charts.Series<LinearClicks, int>(
id: 'Tablet',
colorFn: (_, __) => charts.MaterialPalette.red.shadeDefault,
domainFn: (LinearClicks clickCount, _) => clickCount.year,
@@ -116,7 +117,7 @@ class DisjointMeasureAxisLineChart extends StatelessWidget {
)
// Set the 'Tablet' series to use a disjoint axis.
..setAttribute(charts.measureAxisIdKey, 'axis 2'),
new charts.Series<LinearClicks, int>(
charts.Series<LinearClicks, int>(
id: 'Mobile',
colorFn: (_, __) => charts.MaterialPalette.green.shadeDefault,
domainFn: (LinearClicks clickCount, _) => clickCount.year,
@@ -125,7 +126,7 @@ class DisjointMeasureAxisLineChart extends StatelessWidget {
)
// Set the 'Mobile' series to use a disjoint axis.
..setAttribute(charts.measureAxisIdKey, 'axis 3'),
new charts.Series<LinearClicks, int>(
charts.Series<LinearClicks, int>(
id: 'Click Rate',
colorFn: (_, __) => charts.MaterialPalette.purple.shadeDefault,
domainFn: (LinearClicks clickCount, _) => clickCount.year,
@@ -141,7 +142,7 @@ class DisjointMeasureAxisLineChart extends StatelessWidget {
@override
Widget build(BuildContext context) {
return new charts.LineChart(seriesList,
return charts.LineChart(seriesList,
animate: animate,
// Configure a primary measure axis that will render gridlines across
// the chart. This axis uses fake ticks with no labels to ensure that we
@@ -149,15 +150,15 @@ class DisjointMeasureAxisLineChart extends StatelessWidget {
//
// We do this because disjoint measure axes do not draw any tick
// elements on the chart.
primaryMeasureAxis: new charts.NumericAxisSpec(
tickProviderSpec: new charts.StaticNumericTickProviderSpec(
primaryMeasureAxis: const charts.NumericAxisSpec(
tickProviderSpec: charts.StaticNumericTickProviderSpec(
// Create the ticks to be used the domain axis.
<charts.TickSpec<num>>[
new charts.TickSpec(0, label: ''),
new charts.TickSpec(1, label: ''),
new charts.TickSpec(2, label: ''),
new charts.TickSpec(3, label: ''),
new charts.TickSpec(4, label: ''),
charts.TickSpec(0, label: ''),
charts.TickSpec(1, label: ''),
charts.TickSpec(2, label: ''),
charts.TickSpec(3, label: ''),
charts.TickSpec(4, label: ''),
],
)),
// Create one disjoint measure axis per series on the chart.
@@ -165,11 +166,11 @@ class DisjointMeasureAxisLineChart extends StatelessWidget {
// Disjoint measure axes will be used to scale the rendered data,
// without drawing any tick elements on either side of the chart.
disjointMeasureAxes:
new LinkedHashMap<String, charts.NumericAxisSpec>.from({
'axis 1': new charts.NumericAxisSpec(),
'axis 2': new charts.NumericAxisSpec(),
'axis 3': new charts.NumericAxisSpec(),
'axis 4': new charts.NumericAxisSpec(),
LinkedHashMap<String, charts.NumericAxisSpec>.from({
'axis 1': const charts.NumericAxisSpec(),
'axis 2': const charts.NumericAxisSpec(),
'axis 3': const charts.NumericAxisSpec(),
'axis 4': const charts.NumericAxisSpec(),
}));
}
@@ -180,46 +181,46 @@ class DisjointMeasureAxisLineChart extends StatelessWidget {
// to each other, without the largest magnitude series compressing the
// smallest.
final myFakeDesktopData = [
new LinearClicks(0, clickCount: 25),
new LinearClicks(1, clickCount: 125),
new LinearClicks(2, clickCount: 920),
new LinearClicks(3, clickCount: 375),
LinearClicks(0, clickCount: 25),
LinearClicks(1, clickCount: 125),
LinearClicks(2, clickCount: 920),
LinearClicks(3, clickCount: 375),
];
final myFakeTabletData = [
new LinearClicks(0, clickCount: 375),
new LinearClicks(1, clickCount: 1850),
new LinearClicks(2, clickCount: 9700),
new LinearClicks(3, clickCount: 5000),
LinearClicks(0, clickCount: 375),
LinearClicks(1, clickCount: 1850),
LinearClicks(2, clickCount: 9700),
LinearClicks(3, clickCount: 5000),
];
final myFakeMobileData = [
new LinearClicks(0, clickCount: 5000),
new LinearClicks(1, clickCount: 25000),
new LinearClicks(2, clickCount: 100000),
new LinearClicks(3, clickCount: 75000),
LinearClicks(0, clickCount: 5000),
LinearClicks(1, clickCount: 25000),
LinearClicks(2, clickCount: 100000),
LinearClicks(3, clickCount: 75000),
];
// The fourth series renders with decimal values, representing a very
// different sort ratio-based data. If this was on the same axis as any of
// the other series, it would be squashed near zero.
final myFakeClickRateData = [
new LinearClicks(0, clickRate: .25),
new LinearClicks(1, clickRate: .65),
new LinearClicks(2, clickRate: .50),
new LinearClicks(3, clickRate: .30),
LinearClicks(0, clickRate: .25),
LinearClicks(1, clickRate: .65),
LinearClicks(2, clickRate: .50),
LinearClicks(3, clickRate: .30),
];
return [
// We render an empty series on the primary measure axis to ensure that
// the axis itself gets rendered. This helps us draw the gridlines on the
// chart.
new charts.Series<LinearClicks, int>(
charts.Series<LinearClicks, int>(
id: 'Fake Series',
domainFn: (LinearClicks clickCount, _) => clickCount.year,
measureFn: (LinearClicks clickCount, _) => clickCount.clickCount,
data: []),
new charts.Series<LinearClicks, int>(
charts.Series<LinearClicks, int>(
id: 'Desktop',
colorFn: (_, __) => charts.MaterialPalette.blue.shadeDefault,
domainFn: (LinearClicks clickCount, _) => clickCount.year,
@@ -228,7 +229,7 @@ class DisjointMeasureAxisLineChart extends StatelessWidget {
)
// Set the 'Desktop' series to use a disjoint axis.
..setAttribute(charts.measureAxisIdKey, 'axis 1'),
new charts.Series<LinearClicks, int>(
charts.Series<LinearClicks, int>(
id: 'Tablet',
colorFn: (_, __) => charts.MaterialPalette.red.shadeDefault,
domainFn: (LinearClicks clickCount, _) => clickCount.year,
@@ -237,7 +238,7 @@ class DisjointMeasureAxisLineChart extends StatelessWidget {
)
// Set the 'Tablet' series to use a disjoint axis.
..setAttribute(charts.measureAxisIdKey, 'axis 2'),
new charts.Series<LinearClicks, int>(
charts.Series<LinearClicks, int>(
id: 'Mobile',
colorFn: (_, __) => charts.MaterialPalette.green.shadeDefault,
domainFn: (LinearClicks clickCount, _) => clickCount.year,
@@ -246,7 +247,7 @@ class DisjointMeasureAxisLineChart extends StatelessWidget {
)
// Set the 'Mobile' series to use a disjoint axis.
..setAttribute(charts.measureAxisIdKey, 'axis 3'),
new charts.Series<LinearClicks, int>(
charts.Series<LinearClicks, int>(
id: 'Click Rate',
colorFn: (_, __) => charts.MaterialPalette.purple.shadeDefault,
domainFn: (LinearClicks clickCount, _) => clickCount.year,

35
web/charts/lib/axes/measure_axis_label_alignment.dart
View File

@@ -26,10 +26,11 @@ class MeasureAxisLabelAlignment extends StatelessWidget {
final List<charts.Series> seriesList;
final bool animate;
MeasureAxisLabelAlignment(this.seriesList, {this.animate});
const MeasureAxisLabelAlignment(this.seriesList, {this.animate, Key key})
: super(key: key);
factory MeasureAxisLabelAlignment.withSampleData() {
return new MeasureAxisLabelAlignment(
return MeasureAxisLabelAlignment(
_createSampleData(),
// Disable animations for image tests.
animate: false,
@@ -41,22 +42,22 @@ class MeasureAxisLabelAlignment extends StatelessWidget {
// It is used for creating random series data to demonstrate animation in
// the example app only.
factory MeasureAxisLabelAlignment.withRandomData() {
return new MeasureAxisLabelAlignment(_createRandomData());
return MeasureAxisLabelAlignment(_createRandomData());
}
/// Create random data.
static List<charts.Series<OrdinalSales, String>> _createRandomData() {
final random = new Random();
final random = Random();
final globalSalesData = [
new OrdinalSales('2014', random.nextInt(100) * 100),
new OrdinalSales('2015', random.nextInt(100) * 100),
new OrdinalSales('2016', random.nextInt(100) * 100),
new OrdinalSales('2017', random.nextInt(100) * 100),
OrdinalSales('2014', random.nextInt(100) * 100),
OrdinalSales('2015', random.nextInt(100) * 100),
OrdinalSales('2016', random.nextInt(100) * 100),
OrdinalSales('2017', random.nextInt(100) * 100),
];
return [
new charts.Series<OrdinalSales, String>(
charts.Series<OrdinalSales, String>(
id: 'Global Revenue',
domainFn: (OrdinalSales sales, _) => sales.year,
measureFn: (OrdinalSales sales, _) => sales.sales,
@@ -68,15 +69,15 @@ class MeasureAxisLabelAlignment extends StatelessWidget {
@override
Widget build(BuildContext context) {
return new charts.BarChart(
return charts.BarChart(
seriesList,
animate: animate,
/// Customize the primary measure axis using a small tick renderer.
/// Use String instead of num for ordinal domain axis
/// (typically bar charts).
primaryMeasureAxis: new charts.NumericAxisSpec(
renderSpec: new charts.GridlineRendererSpec(
primaryMeasureAxis: const charts.NumericAxisSpec(
renderSpec: charts.GridlineRendererSpec(
// Display the measure axis labels below the gridline.
//
// 'Before' & 'after' follow the axis value direction.
@@ -96,14 +97,14 @@ class MeasureAxisLabelAlignment extends StatelessWidget {
/// Create series list with single 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),
];
return [
new charts.Series<OrdinalSales, String>(
charts.Series<OrdinalSales, String>(
id: 'Global Revenue',
domainFn: (OrdinalSales sales, _) => sales.year,
measureFn: (OrdinalSales sales, _) => sales.sales,

63
web/charts/lib/axes/nonzero_bound_measure_axis.dart
View File

@@ -25,11 +25,12 @@ class NonzeroBoundMeasureAxis extends StatelessWidget {
final List<charts.Series> seriesList;
final bool animate;
NonzeroBoundMeasureAxis(this.seriesList, {this.animate});
const NonzeroBoundMeasureAxis(this.seriesList, {this.animate, Key key})
: super(key: key);
/// Creates a [TimeSeriesChart] with sample data and no transition.
factory NonzeroBoundMeasureAxis.withSampleData() {
return new NonzeroBoundMeasureAxis(
return NonzeroBoundMeasureAxis(
_createSampleData(),
// Disable animations for image tests.
animate: false,
@@ -41,29 +42,29 @@ class NonzeroBoundMeasureAxis extends StatelessWidget {
// It is used for creating random series data to demonstrate animation in
// the example app only.
factory NonzeroBoundMeasureAxis.withRandomData() {
return new NonzeroBoundMeasureAxis(_createRandomData());
return NonzeroBoundMeasureAxis(_createRandomData());
}
/// Create random data.
static List<charts.Series<MyRow, DateTime>> _createRandomData() {
final random = new Random();
final random = Random();
final data = [
new MyRow(new DateTime(2017, 9, 25), random.nextInt(100) + 100),
new MyRow(new DateTime(2017, 9, 26), random.nextInt(100) + 100),
new MyRow(new DateTime(2017, 9, 27), random.nextInt(100) + 100),
new MyRow(new DateTime(2017, 9, 28), random.nextInt(100) + 100),
new MyRow(new DateTime(2017, 9, 29), random.nextInt(100) + 100),
new MyRow(new DateTime(2017, 9, 30), random.nextInt(100) + 100),
new MyRow(new DateTime(2017, 10, 01), random.nextInt(100) + 100),
new MyRow(new DateTime(2017, 10, 02), random.nextInt(100) + 100),
new MyRow(new DateTime(2017, 10, 03), random.nextInt(100) + 100),
new MyRow(new DateTime(2017, 10, 04), random.nextInt(100) + 100),
new MyRow(new DateTime(2017, 10, 05), random.nextInt(100) + 100),
MyRow(DateTime(2017, 9, 25), random.nextInt(100) + 100),
MyRow(DateTime(2017, 9, 26), random.nextInt(100) + 100),
MyRow(DateTime(2017, 9, 27), random.nextInt(100) + 100),
MyRow(DateTime(2017, 9, 28), random.nextInt(100) + 100),
MyRow(DateTime(2017, 9, 29), random.nextInt(100) + 100),
MyRow(DateTime(2017, 9, 30), random.nextInt(100) + 100),
MyRow(DateTime(2017, 10, 01), random.nextInt(100) + 100),
MyRow(DateTime(2017, 10, 02), random.nextInt(100) + 100),
MyRow(DateTime(2017, 10, 03), random.nextInt(100) + 100),
MyRow(DateTime(2017, 10, 04), random.nextInt(100) + 100),
MyRow(DateTime(2017, 10, 05), random.nextInt(100) + 100),
];
return [
new charts.Series<MyRow, DateTime>(
charts.Series<MyRow, DateTime>(
id: 'Headcount',
domainFn: (MyRow row, _) => row.timeStamp,
measureFn: (MyRow row, _) => row.headcount,
@@ -75,33 +76,33 @@ class NonzeroBoundMeasureAxis extends StatelessWidget {
@override
Widget build(BuildContext context) {
return new charts.TimeSeriesChart(seriesList,
return charts.TimeSeriesChart(seriesList,
animate: animate,
// Provide a tickProviderSpec which does NOT require that zero is
// included.
primaryMeasureAxis: new charts.NumericAxisSpec(
primaryMeasureAxis: const charts.NumericAxisSpec(
tickProviderSpec:
new charts.BasicNumericTickProviderSpec(zeroBound: false)));
charts.BasicNumericTickProviderSpec(zeroBound: false)));
}
/// Create one series with sample hard coded data.
static List<charts.Series<MyRow, DateTime>> _createSampleData() {
final data = [
new MyRow(new DateTime(2017, 9, 25), 106),
new MyRow(new DateTime(2017, 9, 26), 108),
new MyRow(new DateTime(2017, 9, 27), 106),
new MyRow(new DateTime(2017, 9, 28), 109),
new MyRow(new DateTime(2017, 9, 29), 111),
new MyRow(new DateTime(2017, 9, 30), 115),
new MyRow(new DateTime(2017, 10, 01), 125),
new MyRow(new DateTime(2017, 10, 02), 133),
new MyRow(new DateTime(2017, 10, 03), 127),
new MyRow(new DateTime(2017, 10, 04), 131),
new MyRow(new DateTime(2017, 10, 05), 123),
MyRow(DateTime(2017, 9, 25), 106),
MyRow(DateTime(2017, 9, 26), 108),
MyRow(DateTime(2017, 9, 27), 106),
MyRow(DateTime(2017, 9, 28), 109),
MyRow(DateTime(2017, 9, 29), 111),
MyRow(DateTime(2017, 9, 30), 115),
MyRow(DateTime(2017, 10, 01), 125),
MyRow(DateTime(2017, 10, 02), 133),
MyRow(DateTime(2017, 10, 03), 127),
MyRow(DateTime(2017, 10, 04), 131),
MyRow(DateTime(2017, 10, 05), 123),
];
return [
new charts.Series<MyRow, DateTime>(
charts.Series<MyRow, DateTime>(
id: 'Headcount',
domainFn: (MyRow row, _) => row.timeStamp,
measureFn: (MyRow row, _) => row.headcount,

65
web/charts/lib/axes/numeric_initial_viewport.dart
View File

@@ -32,11 +32,12 @@ class NumericInitialViewport extends StatelessWidget {
final List<charts.Series> seriesList;
final bool animate;
NumericInitialViewport(this.seriesList, {this.animate});
const NumericInitialViewport(this.seriesList, {this.animate, Key key})
: super(key: key);
/// Creates a [LineChart] with sample data and no transition.
factory NumericInitialViewport.withSampleData() {
return new NumericInitialViewport(
return NumericInitialViewport(
_createSampleData(),
// Disable animations for image tests.
animate: false,
@@ -48,29 +49,29 @@ class NumericInitialViewport extends StatelessWidget {
// It is used for creating random series data to demonstrate animation in
// the example app only.
factory NumericInitialViewport.withRandomData() {
return new NumericInitialViewport(_createRandomData());
return NumericInitialViewport(_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)),
new LinearSales(4, random.nextInt(100)),
new LinearSales(5, random.nextInt(100)),
new LinearSales(6, random.nextInt(100)),
new LinearSales(7, random.nextInt(100)),
new LinearSales(8, random.nextInt(100)),
new LinearSales(9, random.nextInt(100)),
new LinearSales(10, random.nextInt(100)),
LinearSales(0, random.nextInt(100)),
LinearSales(1, random.nextInt(100)),
LinearSales(2, random.nextInt(100)),
LinearSales(3, random.nextInt(100)),
LinearSales(4, random.nextInt(100)),
LinearSales(5, random.nextInt(100)),
LinearSales(6, random.nextInt(100)),
LinearSales(7, random.nextInt(100)),
LinearSales(8, random.nextInt(100)),
LinearSales(9, random.nextInt(100)),
LinearSales(10, random.nextInt(100)),
];
return [
new charts.Series<LinearSales, int>(
charts.Series<LinearSales, int>(
id: 'Sales',
colorFn: (_, __) => charts.MaterialPalette.blue.shadeDefault,
domainFn: (LinearSales sales, _) => sales.year,
@@ -83,37 +84,37 @@ class NumericInitialViewport extends StatelessWidget {
@override
Widget build(BuildContext context) {
return new charts.LineChart(
return charts.LineChart(
seriesList,
animate: animate,
domainAxis: new charts.NumericAxisSpec(
domainAxis: const charts.NumericAxisSpec(
// Set the initial viewport by providing a new AxisSpec with the
// desired viewport, in NumericExtents.
viewport: new charts.NumericExtents(3.0, 7.0)),
viewport: charts.NumericExtents(3.0, 7.0)),
// Optionally add a pan or pan and zoom behavior.
// If pan/zoom is not added, the viewport specified remains the viewport.
behaviors: [new charts.PanAndZoomBehavior()],
behaviors: [charts.PanAndZoomBehavior()],
);
}
/// 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),
new LinearSales(4, 55),
new LinearSales(5, 66),
new LinearSales(6, 110),
new LinearSales(7, 70),
new LinearSales(8, 20),
new LinearSales(9, 25),
new LinearSales(10, 45),
LinearSales(0, 5),
LinearSales(1, 25),
LinearSales(2, 100),
LinearSales(3, 75),
LinearSales(4, 55),
LinearSales(5, 66),
LinearSales(6, 110),
LinearSales(7, 70),
LinearSales(8, 20),
LinearSales(9, 25),
LinearSales(10, 45),
];
return [
new charts.Series<LinearSales, int>(
charts.Series<LinearSales, int>(
id: 'Sales',
colorFn: (_, __) => charts.MaterialPalette.blue.shadeDefault,
domainFn: (LinearSales sales, _) => sales.year,

89
web/charts/lib/axes/ordinal_initial_viewport.dart
View File

@@ -32,11 +32,12 @@ class OrdinalInitialViewport extends StatelessWidget {
final List<charts.Series> seriesList;
final bool animate;
OrdinalInitialViewport(this.seriesList, {this.animate});
const OrdinalInitialViewport(this.seriesList, {this.animate, Key key})
: super(key: key);
/// Creates a [BarChart] with sample data and no transition.
factory OrdinalInitialViewport.withSampleData() {
return new OrdinalInitialViewport(
return OrdinalInitialViewport(
_createSampleData(),
// Disable animations for image tests.
animate: false,
@@ -48,35 +49,35 @@ class OrdinalInitialViewport extends StatelessWidget {
// It is used for creating random series data to demonstrate animation in
// the example app only.
factory OrdinalInitialViewport.withRandomData() {
return new OrdinalInitialViewport(_createRandomData());
return OrdinalInitialViewport(_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)),
new OrdinalSales('2018', random.nextInt(100)),
new OrdinalSales('2019', random.nextInt(100)),
new OrdinalSales('2020', random.nextInt(100)),
new OrdinalSales('2021', random.nextInt(100)),
new OrdinalSales('2022', random.nextInt(100)),
new OrdinalSales('2023', random.nextInt(100)),
new OrdinalSales('2024', random.nextInt(100)),
new OrdinalSales('2025', random.nextInt(100)),
new OrdinalSales('2026', random.nextInt(100)),
new OrdinalSales('2027', random.nextInt(100)),
new OrdinalSales('2028', random.nextInt(100)),
new OrdinalSales('2029', random.nextInt(100)),
new OrdinalSales('2030', random.nextInt(100)),
OrdinalSales('2014', random.nextInt(100)),
OrdinalSales('2015', random.nextInt(100)),
OrdinalSales('2016', random.nextInt(100)),
OrdinalSales('2017', random.nextInt(100)),
OrdinalSales('2018', random.nextInt(100)),
OrdinalSales('2019', random.nextInt(100)),
OrdinalSales('2020', random.nextInt(100)),
OrdinalSales('2021', random.nextInt(100)),
OrdinalSales('2022', random.nextInt(100)),
OrdinalSales('2023', random.nextInt(100)),
OrdinalSales('2024', random.nextInt(100)),
OrdinalSales('2025', random.nextInt(100)),
OrdinalSales('2026', random.nextInt(100)),
OrdinalSales('2027', random.nextInt(100)),
OrdinalSales('2028', random.nextInt(100)),
OrdinalSales('2029', random.nextInt(100)),
OrdinalSales('2030', random.nextInt(100)),
];
return [
new charts.Series<OrdinalSales, String>(
charts.Series<OrdinalSales, String>(
id: 'Sales',
colorFn: (_, __) => charts.MaterialPalette.blue.shadeDefault,
domainFn: (OrdinalSales sales, _) => sales.year,
@@ -89,43 +90,43 @@ class OrdinalInitialViewport extends StatelessWidget {
@override
Widget build(BuildContext context) {
return new charts.BarChart(
return charts.BarChart(
seriesList,
animate: animate,
// Set the initial viewport by providing a new AxisSpec with the
// desired viewport: a starting domain and the data size.
domainAxis: new charts.OrdinalAxisSpec(
viewport: new charts.OrdinalViewport('2018', 4)),
domainAxis:
charts.OrdinalAxisSpec(viewport: charts.OrdinalViewport('2018', 4)),
// Optionally add a pan or pan and zoom behavior.
// If pan/zoom is not added, the viewport specified remains the viewport.
behaviors: [new charts.PanAndZoomBehavior()],
behaviors: [charts.PanAndZoomBehavior()],
);
}
/// 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),
new OrdinalSales('2018', 33),
new OrdinalSales('2019', 80),
new OrdinalSales('2020', 21),
new OrdinalSales('2021', 77),
new OrdinalSales('2022', 8),
new OrdinalSales('2023', 12),
new OrdinalSales('2024', 42),
new OrdinalSales('2025', 70),
new OrdinalSales('2026', 77),
new OrdinalSales('2027', 55),
new OrdinalSales('2028', 19),
new OrdinalSales('2029', 66),
new OrdinalSales('2030', 27),
OrdinalSales('2014', 5),
OrdinalSales('2015', 25),
OrdinalSales('2016', 100),
OrdinalSales('2017', 75),
OrdinalSales('2018', 33),
OrdinalSales('2019', 80),
OrdinalSales('2020', 21),
OrdinalSales('2021', 77),
OrdinalSales('2022', 8),
OrdinalSales('2023', 12),
OrdinalSales('2024', 42),
OrdinalSales('2025', 70),
OrdinalSales('2026', 77),
OrdinalSales('2027', 55),
OrdinalSales('2028', 19),
OrdinalSales('2029', 66),
OrdinalSales('2030', 27),
];
return [
new charts.Series<OrdinalSales, String>(
charts.Series<OrdinalSales, String>(
id: 'Sales',
colorFn: (_, __) => charts.MaterialPalette.blue.shadeDefault,
domainFn: (OrdinalSales sales, _) => sales.year,

35
web/charts/lib/axes/short_tick_length_axis.dart
View File

@@ -30,10 +30,11 @@ class ShortTickLengthAxis extends StatelessWidget {
final List<charts.Series> seriesList;
final bool animate;
ShortTickLengthAxis(this.seriesList, {this.animate});
const ShortTickLengthAxis(this.seriesList, {this.animate, Key key})
: super(key: key);
factory ShortTickLengthAxis.withSampleData() {
return new ShortTickLengthAxis(
return ShortTickLengthAxis(
_createSampleData(),
// Disable animations for image tests.
animate: false,
@@ -45,22 +46,22 @@ class ShortTickLengthAxis extends StatelessWidget {
// It is used for creating random series data to demonstrate animation in
// the example app only.
factory ShortTickLengthAxis.withRandomData() {
return new ShortTickLengthAxis(_createRandomData());
return ShortTickLengthAxis(_createRandomData());
}
/// Create random data.
static List<charts.Series<OrdinalSales, String>> _createRandomData() {
final random = new Random();
final random = Random();
final globalSalesData = [
new OrdinalSales('2014', random.nextInt(100) * 100),
new OrdinalSales('2015', random.nextInt(100) * 100),
new OrdinalSales('2016', random.nextInt(100) * 100),
new OrdinalSales('2017', random.nextInt(100) * 100),
OrdinalSales('2014', random.nextInt(100) * 100),
OrdinalSales('2015', random.nextInt(100) * 100),
OrdinalSales('2016', random.nextInt(100) * 100),
OrdinalSales('2017', random.nextInt(100) * 100),
];
return [
new charts.Series<OrdinalSales, String>(
charts.Series<OrdinalSales, String>(
id: 'Global Revenue',
domainFn: (OrdinalSales sales, _) => sales.year,
measureFn: (OrdinalSales sales, _) => sales.sales,
@@ -72,15 +73,15 @@ class ShortTickLengthAxis extends StatelessWidget {
@override
Widget build(BuildContext context) {
return new charts.BarChart(
return charts.BarChart(
seriesList,
animate: animate,
/// Customize the primary measure axis using a small tick renderer.
/// Note: use String instead of num for ordinal domain axis
/// (typically bar charts).
primaryMeasureAxis: new charts.NumericAxisSpec(
renderSpec: new charts.SmallTickRendererSpec(
primaryMeasureAxis: const charts.NumericAxisSpec(
renderSpec: charts.SmallTickRendererSpec(
// Tick and Label styling here.
)),
);
@@ -89,14 +90,14 @@ class ShortTickLengthAxis extends StatelessWidget {
/// Create series list with single 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),
];
return [
new charts.Series<OrdinalSales, String>(
charts.Series<OrdinalSales, String>(
id: 'Global Revenue',
domainFn: (OrdinalSales sales, _) => sales.year,
measureFn: (OrdinalSales sales, _) => sales.sales,

48
web/charts/lib/axes/statically_provided_ticks.dart
View File

@@ -37,10 +37,11 @@ class StaticallyProvidedTicks extends StatelessWidget {
final List<charts.Series> seriesList;
final bool animate;
StaticallyProvidedTicks(this.seriesList, {this.animate});
const StaticallyProvidedTicks(this.seriesList, {this.animate, Key key})
: super(key: key);
factory StaticallyProvidedTicks.withSampleData() {
return new StaticallyProvidedTicks(
return StaticallyProvidedTicks(
_createSampleData(),
// Disable animations for image tests.
animate: false,
@@ -52,22 +53,22 @@ class StaticallyProvidedTicks extends StatelessWidget {
// It is used for creating random series data to demonstrate animation in
// the example app only.
factory StaticallyProvidedTicks.withRandomData() {
return new StaticallyProvidedTicks(_createRandomData());
return StaticallyProvidedTicks(_createRandomData());
}
/// Create random data.
static List<charts.Series<OrdinalSales, String>> _createRandomData() {
final random = new Random();
final random = Random();
final globalSalesData = [
new OrdinalSales('2014', random.nextInt(100) * 100),
new OrdinalSales('2015', random.nextInt(100) * 100),
new OrdinalSales('2016', random.nextInt(100) * 100),
new OrdinalSales('2017', random.nextInt(100) * 100),
OrdinalSales('2014', random.nextInt(100) * 100),
OrdinalSales('2015', random.nextInt(100) * 100),
OrdinalSales('2016', random.nextInt(100) * 100),
OrdinalSales('2017', random.nextInt(100) * 100),
];
return [
new charts.Series<OrdinalSales, String>(
charts.Series<OrdinalSales, String>(
id: 'Global Revenue',
domainFn: (OrdinalSales sales, _) => sales.year,
measureFn: (OrdinalSales sales, _) => sales.sales,
@@ -81,41 +82,40 @@ class StaticallyProvidedTicks extends StatelessWidget {
Widget build(BuildContext context) {
// Create the ticks to be used the domain axis.
final staticTicks = <charts.TickSpec<String>>[
new charts.TickSpec(
const charts.TickSpec(
// Value must match the domain value.
'2014',
// Optional label for this tick, defaults to domain value if not set.
label: 'Year 2014',
// The styling for this tick.
style: new charts.TextStyleSpec(
color: new charts.Color(r: 0x4C, g: 0xAF, b: 0x50))),
style: charts.TextStyleSpec(
color: charts.Color(r: 0x4C, g: 0xAF, b: 0x50))),
// If no text style is specified - the style from renderSpec will be used
// if one is specified.
new charts.TickSpec('2015'),
new charts.TickSpec('2016'),
new charts.TickSpec('2017'),
const charts.TickSpec('2015'),
const charts.TickSpec('2016'),
const charts.TickSpec('2017'),
];
return new charts.BarChart(
return charts.BarChart(
seriesList,
animate: animate,
domainAxis: new charts.OrdinalAxisSpec(
tickProviderSpec:
new charts.StaticOrdinalTickProviderSpec(staticTicks)),
domainAxis: charts.OrdinalAxisSpec(
tickProviderSpec: charts.StaticOrdinalTickProviderSpec(staticTicks)),
);
}
/// Create series list with single 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),
];
return [
new charts.Series<OrdinalSales, String>(
charts.Series<OrdinalSales, String>(
id: 'Global Revenue',
domainFn: (OrdinalSales sales, _) => sales.year,
measureFn: (OrdinalSales sales, _) => sales.sales,