imaNNeo / fl_chart

FL Chart is a highly customizable Flutter chart library that supports Line Chart, Bar Chart, Pie Chart, Scatter Chart, and Radar Chart.
https://flchart.dev
MIT License
6.87k stars 1.78k forks source link

preventCurveOverShooting is difficult to limit overshoot in the x-axis direction #1722

Open artsooter opened 3 months ago

artsooter commented 3 months ago

Describe the bug When my spot have non-uniform distance in the x-axis. (such as spot1:x = 1 , spot2:x = 2 , spot3:x = 20 ..... Some curve will overshooting in the x-axis. I have use preventCurveOverShooting, if i use a bigger preventCurveOvershootingThreshold problem will be solved. but i will lose curve in some spot.

To Reproduce

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

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: Container(
          padding: const EdgeInsets.symmetric(vertical: 200, horizontal: 20),
          child: SizedBox(
            height: 300,
            child: LineChart(
              LineChartData(
                lineBarsData: [
                  LineChartBarData(
                    spots: getSpotData(),
                    isCurved: true,
                    curveSmoothness: 0.5,
                    preventCurveOverShooting: true,
                    preventCurveOvershootingThreshold: 10,
                  )
                ],
              ),
            ),
          ),
        ),
        // This trailing comma makes auto-formatting nicer for build methods.
      ),
    );
  }

  List<FlSpot> getSpotData() {
    List<FlSpot> spots = [];
    spots.add(const FlSpot(1.0, 1));
    spots.add(const FlSpot(2.0, 1));
    spots.add(const FlSpot(20.0, 1));
    spots.add(const FlSpot(21.0, 2));
    spots.add(const FlSpot(22.0, 3));
    return spots;
  }
}

Screenshots

image

Versions

artsooter commented 3 months ago
image image

Here is my way to solve this question. I want know it is a good way to solve?