buildChart method
SfCartesianChart
buildChart()
Get customized column chart
Implementation
SfCartesianChart buildChart() {
// final bool isDark = ThemeService().isThemeFromBox();
// final List<Color> palette =
// isDark ? AppUtils().darkPalette : AppUtils().lightPalette;
return SfCartesianChart(
// palette: palette,
plotAreaBorderWidth: 2,
primaryXAxis: DateTimeAxis(
dateFormat: DateFormat('dd-MM-yy'),
intervalType: DateTimeIntervalType.days,
majorGridLines: const MajorGridLines(width: 0),
),
// legend: const Legend(isVisible: true), // Show legend for different series
// tooltipBehavior: TooltipBehavior(enable: true), // Show tooltips
// Tooltip for Hover/Tap
tooltipBehavior: TooltipBehavior(
enable: true,
header: '',
format: 'point.x : point.y', // Show date & value
),
// Trackball (Shows all series values at cursor)
trackballBehavior: TrackballBehavior(
enable: true,
activationMode: ActivationMode.singleTap, // Works on tap/hover
tooltipDisplayMode: TrackballDisplayMode.groupAllPoints,
lineType: TrackballLineType.vertical,
),
series: yKeys.map((yKey) {
final int index = yKeys.indexOf(yKey); // Get index of current yKey
// final Color originalColor =
// palette[index % palette.length].withOpacity(0.9);
// final Color borderColor = Color.lerp(originalColor, Colors.black, 0.3)!;
return SplineAreaSeries<ChartData, DateTime>(
dataSource: dataSource,
animationDuration: 1500,
borderWidth: 2,
// borderColor: borderColor,
gradient: AppGradients.getByIndex(index),
markerSettings: const MarkerSettings(isVisible: true),
xValueMapper: (ChartData data, _) => data.x,
yValueMapper: (ChartData data, _) => data.getYValue(yKey),
name: yKey, // Optional: Add legend name
);
}).toList(),
);
}