'How to make the zoom and scrolling function of graph curves made in a custom painter

Good time of day.I wrote a custom vertical line graph using a custom painter, where random values are added in real time and now I need to implement the zoom and scrolling function, how can I do this?Thank you all in advance

This is the grid drawing code

class NetChartPainter extends CustomPainter {
  NetChartPainter(this.size, this.verCount, this.horCount);
  final Color shadowColor = Colors.black.withOpacity(0.15);
  final int verCount;
  final Size size;
  final int horCount;

  @override
  void paint(Canvas canvas, Size size) {
    int separateLine = ((verCount - 1) / 2).round();
    print(separateLine);
    double lineX = ((size.width - 20) / verCount);
    paintVerticalLines(lineX, size, separateLine, canvas);

    double lineY = ((size.height - 10) / horCount);
    paintHorizontalLines(lineY, lineX, size, canvas);
  }

  void paintHorizontalLines(
      double lineY, double lineX, Size size, Canvas canvas) {
    for (int i = 0; i < horCount; i++) {
      double dy = ((i + 1) * lineY);
      Offset p1 = Offset(lineX + 20, dy);
      Offset p2 = Offset(size.width - 1, dy);
      final line1 = Paint()
        ..color = const Color(0xFF6D5F62)
        ..shader
        ..strokeWidth = 3;

      canvas.drawLine(p1, p2, line1);
    }

 
  }

  void paintVerticalLines(
      double lineX, Size size, int separateLine, Canvas canvas) {
    for (int i = 0; i < verCount; i++) {
      double dx = ((i + 1) * lineX) + 20;
      Offset p1 = Offset(dx, 1);
      Offset p2 = Offset(dx, size.height - 10);
      final line1 = Paint()
        ..color = const Color(0xFF6D5F62)
        ..shader
        ..strokeWidth = i == separateLine ? 7 : 2;

      canvas.drawLine(p1, p2, line1);
    }
  }

This code calculates the points and connects them with lines, now conicTo is not used


List<Offset> _computePoints(
      Offset c, double width, double height, double hr) {
    List<Offset> points = [];
    x.forEach((yp) {
      final xx = width - (yp - min) * hr;
      final dp = Offset(xx, c.dy);
      points.add(dp);
      c += Offset(0, height);
    });
    return points;
  }

  @override
  bool shouldRebuildSemantics(CurvesPainter oldDelegate) => false;

   Path _computePath(List<Offset> points) {
    final path = Path();
    for (var i = 0; i < points.length; i++) {
      final p = points[i];
      if (i == 0) {
        path.moveTo(p.dx, p.dy);
      } else {
        path.lineTo(p.dx, p.dy);
      }
    }
    return path;
  }
}


Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source