flutter - 在charts_flutter中设置轴的最小和最大范围
问题描述
如何在charts_flutter中设置 x 轴的范围?我的数据样本是 (5000, 5.0),(5001, 25.2),(5002, 100.5),(5003, 75.8)。
我的代码是
/// Example of a simple line chart.
import 'package:charts_flutter/flutter.dart' as charts;
import 'package:flutter/material.dart';
class SimpleLineChart extends StatelessWidget {
final List<charts.Series> seriesList;
final bool animate;
SimpleLineChart(this.seriesList, {this.animate});
/// Creates a [LineChart] with sample data and no transition.
factory SimpleLineChart.withSampleData() {
return SimpleLineChart(
_createSampleData(),
// Disable animations for image tests.
animate: false,
);
}
@override
Widget build(BuildContext context) {
return Container(
height: 300,
// decoration: const BoxDecoration(color: Color(0xff232d37)),
width: double.infinity,
padding:
const EdgeInsets.only(right: 18.0, left: 12.0, top: 24, bottom: 12),
child: charts.LineChart(seriesList, animate: animate),
);
}
/// Create one series with sample hard coded data.
static List<charts.Series<LinearSales, int>> _createSampleData() {
final data = [
LinearSales(5000, 5.0),
LinearSales(5001, 25.2),
LinearSales(5002, 100.5),
LinearSales(5003, 75.8),
];
return [
charts.Series<LinearSales, int>(
id: 'Sales',
colorFn: (_, __) => charts.MaterialPalette.blue.shadeDefault,
domainFn: (LinearSales sales, _) {
return sales.year;
},
measureFn: (LinearSales sales, _) {
return sales.sales;
},
data: data,
domainLowerBoundFn: (s, _) => 5000,
domainUpperBoundFn: (s, _) => 5010,
)
];
}
}
/// Sample linear data type.
class LinearSales {
final int year;
final double sales;
LinearSales(this.year, this.sales);
}
它显示一条直线,但我希望 x 轴从 5000 开始并在 5010 结束。我尝试将其设置为
domainLowerBoundFn 和 domainUpperBoundFn 但它仍然从 0 开始。我该如何解决?
参考:图表颤振画廊
解决方案
您可以设置域轴。
这个怎么样?
child: charts.LineChart(
seriesList,
animate: animate,
domainAxis: const charts.NumericAxisSpec(
tickProviderSpec:
charts.BasicNumericTickProviderSpec(zeroBound: false),
viewport: charts.NumericExtents(5000.0, 5005.0),
),
),
或这个?
child: charts.LineChart(
seriesList,
animate: animate,
domainAxis: const charts.NumericAxisSpec(
tickProviderSpec:
charts.BasicNumericTickProviderSpec(zeroBound: false),
),
),
推荐阅读
- xamarin - Visual Studio 中 xamarin iOS 应用的手动预配不起作用
- javascript - fancybox 适合容器的图像
- mysql - 带有变量方法、查询和限制的 mySQL 存储过程
- excel - 粗体 TOP M 列中的最大 50% 值
- scala - IOException while overwriting parquet
- python - 初始化keras模型并等待预测调用
- javascript - d3时钟文本倒置
- flutter - 将 mapEventToState 与传入流一起使用的最佳实践?
- android - Room Invalidation 跟踪器被初始化两次(Room 2.2.0)
- python - 如何通过python脚本(不是模板)播放保存在Django已知目录中的声音?