timeline_chart_eclecticism.dart

import 'package:easy_localization/easy_localization.dart';
import 'package:flutter/material.dart';
import 'package:fl_chart/fl_chart.dart';

import '../../../config/app_colors.dart';
import '../../../models/timeline.dart';

class ChartTimelineEclecticism extends StatelessWidget {
  final TimelineData chartData;

  const ChartTimelineEclecticism({super.key, required this.chartData});

  @override
  Widget build(BuildContext context) {
    return Container(
      height: 100.0,
      child: LineChart(
        LineChartData(
          lineBarsData: getDataEclecticism(),
          backgroundColor: Theme.of(context).colorScheme.onBackground,
          borderData: getBorderData(),
          gridData: getGridData(),
          titlesData: getTitlesData(),
          lineTouchData: getLineTouchDataEclecticism(),
          maxY: 100,
          minY: 0,
        ),
        duration: const Duration(milliseconds: 250),
      ),
    );
  }

  List<LineChartBarData> getDataEclecticism() {
    List<FlSpot> spots = [];

    this.chartData.data.keys.forEach((element) {
      TimelineDataValue? value = this.chartData.data[element];
      if (value != null) {
        final double date = DateTime.parse(element).millisecondsSinceEpoch.toDouble();
        final double eclecticism = value.eclecticism.toDouble();

        spots.add(FlSpot(date, eclecticism));
      }
    });

    return [
      LineChartBarData(
        isCurved: true,
        color: AppColors.contentColorCyan,
        barWidth: 3,
        isStrokeCapRound: false,
        dotData: const FlDotData(show: false),
        belowBarData: BarAreaData(show: true),
        spots: spots,
      ),
    ];
  }

  FlBorderData getBorderData() {
    return FlBorderData(
      show: true,
      border: Border.all(
        color: AppColors.borderColor,
        width: 2,
      ),
    );
  }

  FlGridData getGridData() {
    return const FlGridData(
      show: true,
    );
  }

  FlTitlesData getTitlesData() {
    const AxisTitles none = const AxisTitles(
      sideTitles: SideTitles(showTitles: false),
    );

    final AxisTitles verticalTitles = AxisTitles(
      sideTitles: SideTitles(
        showTitles: true,
        reservedSize: 30,
        getTitlesWidget: getVerticalTitlesWidget,
        interval: 25,
      ),
    );
    final AxisTitles horizontalTitles = AxisTitles(
      sideTitles: SideTitles(
        showTitles: true,
        reservedSize: 20,
        getTitlesWidget: getHorizontalTitlesWidget,
      ),
    );

    return FlTitlesData(
      show: true,
      bottomTitles: horizontalTitles,
      leftTitles: none,
      topTitles: none,
      rightTitles: verticalTitles,
    );
  }

  Widget getVerticalTitlesWidget(double value, TitleMeta meta) {
    return SideTitleWidget(
      axisSide: meta.axisSide,
      space: 4,
      child: Text(
        value.toInt().toString(),
        style: const TextStyle(
          color: AppColors.mainTextColor1,
          fontSize: 12,
        ),
      ),
    );
  }

  Widget getHorizontalTitlesWidget(double value, TitleMeta meta) {
    final DateFormat formatter = DateFormat('dd/MM');

    final DateTime date = DateTime.fromMillisecondsSinceEpoch(value.toInt());
    final String text = formatter.format(date);

    return SideTitleWidget(
      axisSide: meta.axisSide,
      space: 4,
      child: RotationTransition(
        turns: new AlwaysStoppedAnimation(-30 / 360),
        child: Text(
          text,
          style: const TextStyle(
            color: AppColors.mainTextColor1,
            fontSize: 11,
          ),
        ),
      ),
    );
  }

  LineTouchData getLineTouchDataEclecticism() {
    return LineTouchData(
      handleBuiltInTouches: true,
      touchTooltipData: LineTouchTooltipData(
        tooltipBgColor: Colors.transparent,
        tooltipPadding: EdgeInsets.all(8),
        tooltipMargin: 2,
        getTooltipItems: (List<LineBarSpot> touchedSpots) {
          return touchedSpots.map((LineBarSpot touchedSpot) {
            final textStyle = TextStyle(
              color: AppColors.mainTextColor2,
              fontWeight: FontWeight.bold,
              fontSize: 10,
            );
            return LineTooltipItem(
              touchedSpot.y.toString(),
              textStyle,
            );
          }).toList();
        },
      ),
    );
  }
}