Improvement/prevent overshooting

CHANGELOG.md

@@ -1,3 +1,6 @@
+## 0.1.2
+*  added `preventCurveOverShooting` on BarData, check this [issue](https://github.com/imaNNeoFighT/fl_chart/issues/25)
+
 ## 0.1.1
 * nothing important
 

README.md

@@ -36,7 +36,7 @@ Thank you all!
 
 ```kotlin
 dependencies:
-  fl_chart: ^0.1.1
+  fl_chart: ^0.1.2
 ```
 
 

lib/src/chart/line_chart/line_chart_data.dart

@@ -135,6 +135,10 @@ class LineChartBarData {
   /// if it is 0.0, the lines draw with sharp corners.
   final double curveSmoothness;
 
+  /// prevent overshooting when draw curve line on linear sequence spots
+  /// check this [issue](https://github.com/imaNNeoFighT/fl_chart/issues/25)
+  final bool preventCurveOverShooting;
+
   final bool isStrokeCapRound;
 
   /// to fill space below the bar line,
@@ -151,6 +155,7 @@ class LineChartBarData {
     this.barWidth = 2.0,
     this.isCurved = false,
     this.curveSmoothness = 0.35,
+    this.preventCurveOverShooting = false,
     this.isStrokeCapRound = false,
     this.belowBarData = const BelowBarData(),
     this.dotData = const FlDotData(),

lib/src/chart/line_chart/line_chart_painter.dart

@@ -167,40 +167,55 @@ class LineChartPainter extends AxisChartPainter {
     int size = barData.spots.length;
     path.reset();
 
-    double lX = 0.0, lY = 0.0;
+    var temp = const Offset(0.0, 0.0);
 
     double x = getPixelX(barData.spots[0].x, viewSize);
     double y = getPixelY(barData.spots[0].y, viewSize);
     path.moveTo(x, y);
     for (int i = 1; i < size; i++) {
       /// CurrentSpot
-      FlSpot p = barData.spots[i];
-      double px = getPixelX(p.x, viewSize);
-      double py = getPixelY(p.y, viewSize);
+      final current = Offset(
+        getPixelX(barData.spots[i].x, viewSize),
+        getPixelY(barData.spots[i].y, viewSize),
+      );
 
       /// previous spot
-      FlSpot p0 = barData.spots[i - 1];
-      double p0x = getPixelX(p0.x, viewSize);
-      double p0y = getPixelY(p0.y, viewSize);
-
-      double x1 = p0x + lX;
-      double y1 = p0y + lY;
+      final previous = Offset(
+        getPixelX(barData.spots[i - 1].x, viewSize),
+        getPixelY(barData.spots[i - 1].y, viewSize),
+      );
 
       /// next point
-      FlSpot p1 = barData.spots[i + 1 < size ? i + 1 : i];
-      double p1x = getPixelX(p1.x, viewSize);
-      double p1y = getPixelY(p1.y, viewSize);
+      final next = Offset(
+        getPixelX(barData.spots[i + 1 < size ? i + 1 : i].x, viewSize),
+        getPixelY(barData.spots[i + 1 < size ? i + 1 : i].y, viewSize),
+      );
+
+      final controlPoint1 = previous + temp;
 
       /// if the isCurved is false, we set 0 for smoothness,
       /// it means we should not have any smoothness then we face with
       /// the sharped corners line
-      double smoothness = barData.isCurved ? barData.curveSmoothness : 0.0;
-      lX = ((p1x - p0x) / 2) * smoothness;
-      lY = ((p1y - p0y) / 2) * smoothness;
-      double x2 = px - lX;
-      double y2 = py - lY;
+      final smoothness = barData.isCurved ? barData.curveSmoothness : 0.0;
+      temp = ((next - previous) / 2) * smoothness;
+
+      if (barData.preventCurveOverShooting) {
+        if ((next - current).dy <= 10 || (current - previous).dy <= 10) {
+          temp = Offset(temp.dx, 0);
+        }
+
+        if ((next - current).dx <= 10 || (current - previous).dx <= 10) {
+          temp = Offset(0, temp.dy);
+        }
+      }
+
+      final controlPoint2 = current - temp;
 
-      path.cubicTo(x1, y1, x2, y2, px, py);
+      path.cubicTo(
+        controlPoint1.dx, controlPoint1.dy,
+        controlPoint2.dx, controlPoint2.dy,
+        current.dx, current.dy,
+      );
     }
 
     return path;

pubspec.yaml

@@ -1,6 +1,6 @@
 name: fl_chart
 description: A powerful Flutter chart library, currently supporting Line Chart, Bar Chart and Pie Chart.
-version: 0.1.1
+version: 0.1.2
 author: Iman Khoshabi <[email protected]>
 homepage: https://github.com/imaNNeoFighT/fl_chart
 

repo_files/documentations/line_chart.md

@@ -40,6 +40,7 @@ FlChart(
 |barWidth| gets the stroke width of the line bar|2.0|
 |isCurved| curves the corners of the line on the spot's positions| false|
 |curveSmoothness| smoothness radius of the curve corners (works when isCurved is true) | 0.35|
+|preventCurveOverShooting|prevent overshooting when draw curve line on linear sequence spots, check this [issue](https://github.com/imaNNeoFighT/fl_chart/issues/25)| false|
 |isStrokeCapRound| determines whether start and end of the bar line is Qubic or Round | false|
 |belowBarData| check the [BelowBarData](#BelowBarData) |BelowBarData()|
 |dotData| check the [FlDotData](#FlDotData) | FlDotData()|