Flutter CustomPaint Перемещение круга по траектории

Question

Я изучаю CustomPaint, создавая свою собственную линейную диаграмму. Я уже сделал саму диаграмму, так что теперь я делаю вещи вокруг нее. Одним из них является трекбол / линия, когда вы панорамируете. До сих пор я нарисовал пунктирную линию сверху вниз, и она отлично работает, теперь я хочу сделать мяч, который будет следовать вдоль линии. Моя проблема заключается в том, чтобы мяч и пунктирная линия всегда были синхронизированы. прямо сейчас это пунктирная линия, которая следует за моим пальцем, и мяч, который не совпадает. Я нашел этот ответ о переполнении стека, но он не совсем подходит для меня. Это видео показывает, как это работает в настоящее время со следующим кодом:

где dragX — текущее положение пальца по оси X в пикселях.

      void drawTrackballLine(Canvas canvas, Size size) {
    double dashHeight = 5;
    double dashSpace = trackBallOptions.dashSpacing;
    double y = 0;
    final paint = Paint()
      ..color = trackBallOptions.color
      ..strokeWidth = trackBallOptions.strokeWidth;
    while (y < size.height) {
      canvas.drawLine(
        Offset(dragX, y),
        Offset(dragX, y + dashHeight),
        paint,
      );
      y += dashSpace + dashHeight;
    }
}

void drawTrackball(Canvas canvas, Size size, Path path) {
    final pathMetric = path.computeMetrics().elementAt(0);
    final value = pathMetric.length * (dragX / size.width);
    final pos = pathMetric.getTangentForOffset(value);
    canvas.drawCircle(pos!.position, 5, Paint());
}