Flutter 交互式图表图形

Question

我正在寻找一个颤振的包，我可以在其中创建一个带有可交互图形的图表，在那里我可以通过拖放操作数据

示例：示例图表

现在我想通过拖放（上下）调整该步骤图中的每个值

我发现了高图表，我的一些同事用它来这样做，但不是在颤抖，所以我不确定那里是否可能。

Answer 1

首先，使用 Flutter 创建交互式图表是完全可能的。 您可以使用 CustomPainter 和一些小部件自己实现它。

这是一个曲线基本图表的示例。

CustomPaint(
   painter: CurveBackground(color: \\ yourColor),
   child: \\ your child
)


class CurveBackground extends CustomPainter {
  final Color color;

  CurveBackground({this.color});

  @override
  void paint(Canvas canvas, Size size) {
    var paint = Paint();
    paint.color = color;
    paint.style = PaintingStyle.fill;

    var path = Path();

    path.moveTo(0, Dimens.size_30());
    path.quadraticBezierTo(size.width * 0.4, size.height * 0.1,
        size.width * 0.3, size.height * 0.3);
    path.quadraticBezierTo(size.width * 0.1, size.height * 0.6,
        size.width * 0.45, size.height * 0.7);
    path.quadraticBezierTo(
        size.width * 1, size.height * 0.9, size.width * 0.9, size.height * 1.0);
    path.lineTo(size.width, size.height);
    path.lineTo(0, size.height);

    canvas.drawPath(path, paint);
  }

  @override
  bool shouldRepaint(CustomPainter oldDelegate) => true;
}

您还可以查看一些专门的软件包： syncfusion_flutter_charts我想您会对step_line chart感兴趣。

Answer 2

您是否尝试过 charts_flutter或https://pub.dev/packages/syncfusion_flutter_charts ？