我正在开发一个带有菜单选项卡的应用程序,该菜单选项卡使用Charts_flutter:^ 0.8.0显示3种类型的图表,每个图都有其自己的类来生成其值和特征,条形图效果很好,该图薪水工作正常,但折线图会向我抛出一个与尺寸有关的错误
我试图将LineChart添加到sizebox和容器中,但是它不起作用,或者我做错了
[38;5;248m════════ Exception caught by rendering library ═════════════════════════════════[39;49m
[38;5;244mThe following RangeError was thrown during performLayout():[39;49m
RangeError (end): Invalid value: Not in range 0..6, inclusive: 7
[38;5;244mUser-created ancestor of the error-causing widget was[39;49m
[38;5;248mLineChart[39;49m
[38;5;244mWhen the exception was thrown, this was the stack[39;49m
[38;5;244m#0 RangeError.checkValidRange (dart:core/errors.dart:333:9)[39;49m
[38;5;244m#1 List.sublist (dart:core-patch/growable_array.dart:81:22)[39;49m
[38;5;248m#2 LineRenderer._createAreaSegment[39;49m
[38;5;248m#3 LineRenderer._createLineAndAreaSegmentsForSeries[39;49m
[38;5;248m#4 LineRenderer._createLineAndAreaElements[39;49m
[38;5;244m...[39;49m
[38;5;244mThe following RenderObject was being processed when the exception was fired: ChartContainerRenderObject<num>#e88cb NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE[39;49m
[38;5;244mRenderObject: ChartContainerRenderObject<num>#e88cb NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE[39;49m
[38;5;244mparentData: <none> (can use size)[39;49m
[38;5;244mconstraints: BoxConstraints(w=344.0, h=420.0)[39;49m
[38;5;244msemantic boundary[39;49m
[38;5;244msize: MISSING[39;49m
[38;5;248m════════════════════════════════════════════════════════════════════════════════[39;49m
[38;5;248m════════ Exception caught by rendering library ═════════════════════════════════[39;49m
RenderBox was not laid out: ChartContainerRenderObject<num>#e88cb NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1681 pos 12: 'hasSize'
[38;5;244mUser-created ancestor of the error-causing widget was[39;49m
[38;5;248mLineChart[39;49m
[38;5;244mThe following RenderObject was being processed when the exception was fired: RenderPointerListener#4f055 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE[39;49m
[38;5;244mRenderObject: RenderPointerListener#4f055 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE[39;49m
[38;5;244mparentData: <none> (can use size)[39;49m
[38;5;244mconstraints: BoxConstraints(w=344.0, h=420.0)[39;49m
[38;5;244msize: MISSING[39;49m
[38;5;244mbehavior: deferToChild[39;49m
[38;5;244mlisteners: down[39;49m
[38;5;244mchild: ChartContainerRenderObject<num>#e88cb NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE[39;49m
[38;5;244mparentData: <none> (can use size)[39;49m
[38;5;244mconstraints: BoxConstraints(w=344.0, h=420.0)[39;49m
[38;5;244msemantic boundary[39;49m
[38;5;244msize: MISSING[39;49m
[38;5;248m════════════════════════════════════════════════════════════════════════════════[39;49m
[38;5;248m════════ Exception caught by rendering library ═════════════════════════════════[39;49m
RenderBox was not laid out: RenderPointerListener#4f055 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1681 pos 12: 'hasSize'
[38;5;244mUser-created ancestor of the error-causing widget was[39;49m
[38;5;248mLineChart[39;49m
[38;5;248m════════════════════════════════════════════════════════════════════════════════[39;49m
[38;5;248m════════ Exception caught by rendering library ═════════════════════════════════[39;49m
RenderBox was not laid out: RenderSemanticsGestureHandler#379af NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1681 pos 12: 'hasSize'
[38;5;244mUser-created ancestor of the error-causing widget was[39;49m
[38;5;248mLineChart[39;49m
[38;5;248m════════════════════════════════════════════════════════════════════════════════[39;49m
[38;5;248m════════ Exception caught by rendering library ═════════════════════════════════[39;49m
RenderBox was not laid out: ChartContainerRenderObject<num>#e88cb
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1681 pos 12: 'hasSize'
[38;5;244mUser-created ancestor of the error-causing widget was[39;49m
[38;5;248mLineChart[39;49m
[38;5;248m════════════════════════════════════════════════════════════════════════════════
折线图的类别为:
import 'package:flutter/material.dart';
import 'package:charts_flutter/flutter.dart' as charts;
void main() => runApp(LineChart());
class LineChart extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MyHomePage();
}
}
class MyHomePage extends StatefulWidget {
@override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
List<charts.Series<Sales, int>> _seriesLineData;
_generarData(){
var linesalesdata = [
Sales(0, 45),
Sales(1, 56),
Sales(2, 55),
Sales(3, 60),
Sales(4, 61),
Sales(5, 70),
];
var linesalesdata1 = [
Sales(0, 35),
Sales(1, 46),
Sales(2, 45),
Sales(3, 50),
Sales(4, 51),
Sales(5, 60),
];
var linesalesdata2 = [
Sales(0, 20),
Sales(1, 24),
Sales(2, 25),
Sales(3, 40),
Sales(4, 45),
Sales(5, 60),
Sales(5, 60),
];
_seriesLineData.add(
charts.Series(
colorFn: (__, _) => charts.ColorUtil.fromDartColor(Color(0xff990099)),
id: 'Air Pollution',
data: linesalesdata,
domainFn: (Sales sales, _) => sales.yearval,
measureFn: (Sales sales, _) => sales.salesval,
),
);
_seriesLineData.add(
charts.Series(
colorFn: (__, _) => charts.ColorUtil.fromDartColor(Color(0xff109618)),
id: 'Air Pollution',
data: linesalesdata1,
domainFn: (Sales sales, _) => sales.yearval,
measureFn: (Sales sales, _) => sales.salesval,
),
);
_seriesLineData.add(
charts.Series(
colorFn: (__, _) => charts.ColorUtil.fromDartColor(Color(0xffff9900)),
id: 'Air Pollution',
data: linesalesdata2,
domainFn: (Sales sales, _) => sales.yearval,
measureFn: (Sales sales, _) => sales.salesval,
),
);
}
@override
void initState(){
super.initState();
_seriesLineData = List<charts.Series<Sales, int>>();
_generarData();
}
@override
Widget build(BuildContext context) {
return Padding(
padding: EdgeInsets.all(8.0),
child: Container(
child: Center(
child: Column(
children: <Widget>[
Text('Ventas en los ultimos 5 años',style: TextStyle(fontSize: 24.0,fontWeight: FontWeight.bold),),
Expanded(
child: charts.LineChart(
_seriesLineData,
defaultRenderer: charts.LineRendererConfig(includeArea: true, stacked: true),
animate: true,
animationDuration: Duration(seconds: 5),
behaviors: [
charts.ChartTitle('Años',
behaviorPosition: charts.BehaviorPosition.bottom,
titleOutsideJustification:charts.OutsideJustification.middleDrawArea),
charts.ChartTitle('Ventas',
behaviorPosition: charts.BehaviorPosition.start,
titleOutsideJustification: charts.OutsideJustification.middleDrawArea),
charts.ChartTitle('Departamentos',
behaviorPosition: charts.BehaviorPosition.end,
titleOutsideJustification:charts.OutsideJustification.middleDrawArea)
]
),
),
],
),
),
),
);
}
}
class Sales {
int yearval;
int salesval;
Sales(this.yearval, this.salesval);
}
答案 0 :(得分:0)
查看您的变量linesalesdata2
。 Sales(5, 60),
重复了两次。只需将最后一项更正为Sales(6, 60)
,它就可以解决您的问题。
答案 1 :(得分:0)
第1步:丢失了MaterialApp
步骤2:linesalesdata2具有重复的Sales(5,60)
第3步:将重复的空气污染ID更改为1或2,如果您使用相同的ID,则在单击行时,只有一个点将显示,另外两个点将不显示
步骤4:使用容器
完整代码,没有错误消息
import 'package:flutter/material.dart';
import 'package:charts_flutter/flutter.dart' as charts;
void main() => runApp(LineChart());
class LineChart extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(home: MyHomePage());
}
}
class MyHomePage extends StatefulWidget {
@override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
List<charts.Series<Sales, int>> _seriesLineData;
_generarData(){
var linesalesdata = [
Sales(0, 45),
Sales(1, 56),
Sales(2, 55),
Sales(3, 60),
Sales(4, 61),
Sales(5, 70),
];
var linesalesdata1 = [
Sales(0, 35),
Sales(1, 46),
Sales(2, 45),
Sales(3, 50),
Sales(4, 51),
Sales(5, 60),
];
var linesalesdata2 = [
Sales(0, 20),
Sales(1, 24),
Sales(2, 25),
Sales(3, 40),
Sales(4, 45),
Sales(5, 60),
//Sales(5, 60),
];
_seriesLineData.add(
charts.Series(
colorFn: (__, _) => charts.ColorUtil.fromDartColor(Color(0xff990099)),
id: 'Air Pollution',
data: linesalesdata,
domainFn: (Sales sales, _) => sales.yearval,
measureFn: (Sales sales, _) => sales.salesval,
),
);
_seriesLineData.add(
charts.Series(
colorFn: (__, _) => charts.ColorUtil.fromDartColor(Color(0xff109618)),
id: 'Air Pollution1',
data: linesalesdata1,
domainFn: (Sales sales, _) => sales.yearval,
measureFn: (Sales sales, _) => sales.salesval,
),
);
_seriesLineData.add(
charts.Series(
colorFn: (__, _) => charts.ColorUtil.fromDartColor(Color(0xffff9900)),
id: 'Air Pollution2',
data: linesalesdata2,
domainFn: (Sales sales, _) => sales.yearval,
measureFn: (Sales sales, _) => sales.salesval,
),
);
}
@override
void initState(){
super.initState();
_seriesLineData = List<charts.Series<Sales, int>>();
_generarData();
}
@override
Widget build(BuildContext context) {
return Container(
child: Padding(
padding: EdgeInsets.all(8.0),
child: Container(
child: Center(
child: Column(
children: <Widget>[
Text('Ventas en los ultimos 5 años',style: TextStyle(fontSize: 24.0,fontWeight: FontWeight.bold),),
Expanded(
child: charts.LineChart(
_seriesLineData,
defaultRenderer: charts.LineRendererConfig(includeArea: true, stacked: true),
animate: true,
animationDuration: Duration(seconds: 5),
behaviors: [
charts.ChartTitle('Años',
behaviorPosition: charts.BehaviorPosition.bottom,
titleOutsideJustification:charts.OutsideJustification.middleDrawArea),
charts.ChartTitle('Ventas',
behaviorPosition: charts.BehaviorPosition.start,
titleOutsideJustification: charts.OutsideJustification.middleDrawArea),
charts.ChartTitle('Departamentos',
behaviorPosition: charts.BehaviorPosition.end,
titleOutsideJustification:charts.OutsideJustification.middleDrawArea)
]
),
),
],
),
),
),
),
);
}
}
class Sales {
int yearval;
int salesval;
Sales(this.yearval, this.salesval);
}