mirror of
https://github.com/flutter/samples.git
synced 2025-11-08 22:09:06 +00:00
Update web/ samples to work with Flutter SDK (#134)
* add package:http dependency in dad_jokes * add package:http dependency in filipino_cuisine * don't build package:http demos until flutter/flutter#34858 is resolved * update gallery * update github_dataviz * update particle_background * don't build github_dataviz (uses package:http) * update slide_puzzle * update spinning_square * update timeflow * update vision_challenge * update charts * update dad_jokes * update filipino cuisine * ignore build output * update timeflow and vision_challenge * update slide_puzzle * don't commit build/ directory * move preview.png images to assets * fix path url join * update readme * update web/readme.md
This commit is contained in:
John Ryan
GitHub
144
web/charts/lib/axes/custom_axis_tick_formatters.dart
Normal file
144
web/charts/lib/axes/custom_axis_tick_formatters.dart
Normal file
@@ -0,0 +1,144 @@
|
||||
// Copyright 2018 the Charts project authors. Please see the AUTHORS file
|
||||
// for details.
|
||||
//
|
||||
// Licensed under the Apache License, Version 2.0 (the "License");
|
||||
// you may not use this file except in compliance with the License.
|
||||
// You may obtain a copy of the License at
|
||||
//
|
||||
// http://www.apache.org/licenses/LICENSE-2.0
|
||||
//
|
||||
// Unless required by applicable law or agreed to in writing, software
|
||||
// distributed under the License is distributed on an "AS IS" BASIS,
|
||||
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
// See the License for the specific language governing permissions and
|
||||
// limitations under the License.
|
||||
|
||||
/// Example of timeseries chart with custom measure and domain formatters.
|
||||
// EXCLUDE_FROM_GALLERY_DOCS_START
|
||||
import 'dart:math';
|
||||
// EXCLUDE_FROM_GALLERY_DOCS_END
|
||||
import 'package:charts_flutter/flutter.dart' as charts;
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:intl/intl.dart';
|
||||
|
||||
class CustomAxisTickFormatters extends StatelessWidget {
|
||||
final List<charts.Series> seriesList;
|
||||
final bool animate;
|
||||
|
||||
CustomAxisTickFormatters(this.seriesList, {this.animate});
|
||||
|
||||
/// Creates a [TimeSeriesChart] with sample data and no transition.
|
||||
factory CustomAxisTickFormatters.withSampleData() {
|
||||
return new CustomAxisTickFormatters(
|
||||
_createSampleData(),
|
||||
// Disable animations for image tests.
|
||||
animate: false,
|
||||
);
|
||||
}
|
||||
|
||||
// EXCLUDE_FROM_GALLERY_DOCS_START
|
||||
// This section is excluded from being copied to the gallery.
|
||||
// It is used for creating random series data to demonstrate animation in
|
||||
// the example app only.
|
||||
factory CustomAxisTickFormatters.withRandomData() {
|
||||
return new CustomAxisTickFormatters(_createRandomData());
|
||||
}
|
||||
|
||||
/// Create random data.
|
||||
static List<charts.Series<MyRow, DateTime>> _createRandomData() {
|
||||
final random = new 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)),
|
||||
];
|
||||
|
||||
return [
|
||||
new charts.Series<MyRow, DateTime>(
|
||||
id: 'Cost',
|
||||
domainFn: (MyRow row, _) => row.timeStamp,
|
||||
measureFn: (MyRow row, _) => row.cost,
|
||||
data: data,
|
||||
)
|
||||
];
|
||||
}
|
||||
// EXCLUDE_FROM_GALLERY_DOCS_END
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
/// Formatter for numeric ticks using [NumberFormat] to format into currency
|
||||
///
|
||||
/// This is what is used in the [NumericAxisSpec] below.
|
||||
final simpleCurrencyFormatter =
|
||||
new charts.BasicNumericTickFormatterSpec.fromNumberFormat(
|
||||
new NumberFormat.compactSimpleCurrency());
|
||||
|
||||
/// Formatter for numeric ticks that uses the callback provided.
|
||||
///
|
||||
/// Use this formatter if you need to format values that [NumberFormat]
|
||||
/// cannot provide.
|
||||
///
|
||||
/// To see this formatter, change [NumericAxisSpec] to use this formatter.
|
||||
// final customTickFormatter =
|
||||
// charts.BasicNumericTickFormatterSpec((num value) => 'MyValue: $value');
|
||||
|
||||
return new charts.TimeSeriesChart(seriesList,
|
||||
animate: animate,
|
||||
// Sets up a currency formatter for the measure axis.
|
||||
primaryMeasureAxis: new 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
|
||||
/// transitions to a new month.
|
||||
///
|
||||
/// 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(
|
||||
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),
|
||||
];
|
||||
|
||||
return [
|
||||
new charts.Series<MyRow, DateTime>(
|
||||
id: 'Cost',
|
||||
domainFn: (MyRow row, _) => row.timeStamp,
|
||||
measureFn: (MyRow row, _) => row.cost,
|
||||
data: data,
|
||||
)
|
||||
];
|
||||
}
|
||||
}
|
||||
|
||||
/// Sample time series data type.
|
||||
class MyRow {
|
||||
final DateTime timeStamp;
|
||||
final int cost;
|
||||
MyRow(this.timeStamp, this.cost);
|
||||
}
|
||||
Reference in New Issue
Block a user