Merge pull request #11 from VGVentures/feat/animate-line-chart

feat: animate line chart
VGVentures · Aug 20, 2024 · 1152fa8 · 1152fa8
2 parents 06e4476 + f088876
commit 1152fa8
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 1 deletion.
diff --git a/lib/ui/widgets/charts/line_chart/line_chart_body.dart b/lib/ui/widgets/charts/line_chart/line_chart_body.dart
@@ -94,7 +94,6 @@ class _LineChartBodyState extends State<LineChartBody> {
     final strokeStyle = PaintStyle(
       strokeColor: colorScheme.onSurface.withOpacity(0.1),
     );
-
     return Chart<LineChartPoint>(
       data: widget.data,
       gestureStream: _gestureStream,
@@ -120,6 +119,9 @@ class _LineChartBodyState extends State<LineChartBody> {
       },
       marks: [
         LineMark(
+          shape: ShapeEncode(value: BasicLineShape(smooth: true)),
+          transition: Transition(duration: const Duration(seconds: 2)),
+          entrance: {MarkEntrance.x, MarkEntrance.y, MarkEntrance.opacity},
           color: ColorEncode(
             value: colorScheme.primary,
           ),
@@ -130,6 +132,7 @@ class _LineChartBodyState extends State<LineChartBody> {
         ),
         if (widget.showAreaElement)
           AreaMark(
+            shape: ShapeEncode(value: BasicAreaShape(smooth: true)),
             gradient: GradientEncode(
               value: LinearGradient(
                 begin: const Alignment(0, -5),

diff --git a/test/src/ui/widgets/charts/line_chart/line_chart_body_test.dart b/test/src/ui/widgets/charts/line_chart/line_chart_body_test.dart
@@ -55,6 +55,7 @@ void main() {
         await tester.pumpExperience(
           buildSubject(onPointSelected: completer.complete),
         );
+        await tester.pumpAndSettle();
         await tester.tap(find.byType(LineChartBody));
         await tester.pumpAndSettle();