80 lines
2.5 KiB
Dart
80 lines
2.5 KiB
Dart
import 'package:flutter/cupertino.dart';
|
|
import 'package:syncfusion_flutter_charts/charts.dart';
|
|
|
|
// Widget für ein gestapeltes Säulendiagramm
|
|
class StackedColumnChart extends StatelessWidget {
|
|
final List<double> lowerValues;
|
|
final List<double> upperValues;
|
|
|
|
const StackedColumnChart({
|
|
super.key,
|
|
required this.lowerValues,
|
|
required this.upperValues,
|
|
});
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
return SfCartesianChart(
|
|
legend: const Legend(
|
|
isVisible: true, // Legende anzeigen
|
|
position: LegendPosition.top, // Legende unterhalb des Diagramms platzieren
|
|
),
|
|
primaryXAxis: const CategoryAxis(
|
|
title: AxisTitle(text: 'Jahr'),
|
|
),
|
|
primaryYAxis: const NumericAxis(
|
|
title: AxisTitle(text: 'Euro'),
|
|
),
|
|
series: <CartesianSeries>[
|
|
// Untere Teil der Säule
|
|
StackedColumnSeries<SalesData, int>(
|
|
dataSource: _getLowerChartData(),
|
|
xValueMapper: (SalesData sales, _) => sales.year,
|
|
yValueMapper: (SalesData sales, _) => sales.value,
|
|
name: 'Einzahlungen',
|
|
color: CupertinoColors.systemRed.highContrastColor,
|
|
),
|
|
// Obere Teil der Säule
|
|
StackedColumnSeries<SalesData, int>(
|
|
dataSource: _getUpperChartData(),
|
|
xValueMapper: (SalesData sales, _) => sales.year,
|
|
yValueMapper: (SalesData sales, _) => sales.value,
|
|
name: 'Zinsen',
|
|
color: CupertinoColors.systemBlue.highContrastColor,
|
|
),
|
|
],
|
|
// Trackball für Hover-Interaktion
|
|
trackballBehavior: TrackballBehavior(
|
|
enable: true,
|
|
tooltipSettings: const InteractiveTooltip(enable: true),
|
|
activationMode: ActivationMode.singleTap,
|
|
hideDelay: 2000,
|
|
),
|
|
);
|
|
}
|
|
|
|
// Methode zum Erstellen der Daten für den unteren Teil der Säule (Investiertes Geld)
|
|
List<SalesData> _getLowerChartData() {
|
|
List<SalesData> chartData = [];
|
|
for (int i = 0; i < lowerValues.length; i++) {
|
|
chartData.add(SalesData(i + 1, lowerValues[i]));
|
|
}
|
|
return chartData;
|
|
}
|
|
// Methode zum Erstellen der Daten für den oberen Teil der Säule (Investiertes Geld mit Zinsen)
|
|
List<SalesData> _getUpperChartData() {
|
|
List<SalesData> chartData = [];
|
|
for (int i = 0; i < upperValues.length; i++) {
|
|
chartData.add(SalesData(i + 1, upperValues[i]));
|
|
}
|
|
return chartData;
|
|
}
|
|
}
|
|
|
|
class SalesData {
|
|
final int year;
|
|
final double value;
|
|
|
|
SalesData(this.year, this.value);
|
|
}
|