aab29 / bezier.dart

A 2D Bézier curve math library written in Dart
BSD 2-Clause "Simplified" License
54 stars 10 forks source link

Discrepancy between this library and CustomPainter cubicTo #24

Open netgfx opened 2 years ago

netgfx commented 2 years ago

I'm using this library to create a path that consists of multiple curves, the issue is that when I draw the path using CustomPainter cubicTo

var cubic = GameObject.shared.cubicBeziers;
    final Path path = Path();
    for (var i = 0; i < cubic.length; i++) {
      drawCurve(cubic[i], path);
    }
    path.close();
    canvas.drawPath(path, _paint);

    void drawCurve(CubicBezier curve, Path path) {

    vectorMath.Vector2 point0 = curve.startPoint;
    vectorMath.Vector2 point1 = curve.points[1];
    vectorMath.Vector2 point2 = curve.points[2];
    vectorMath.Vector2 point3 = curve.endPoint;
    path.moveTo(point0.x, point0.y);

    path.cubicTo(point1.x, point1.y, point2.x, point2.y, point3.x, point3.y);

  }

And when I follow the path via percentages, they have a difference, especially on the y axis The issue can be seen here:

ezgif-5-be09c688f3

Pomax commented 2 years ago

note that your screenshot is too small to see the code involved. Just drag-and-drop or clipboard paste a full size one into your post and it'll automatically get turned into a markdown link to the full size image, wiith the in-issue image resized to fit.

netgfx commented 2 years ago

@Pomax Sorry the image was to show the moving circle not so much for the code as it spans over 2-3 files. The code that drives the circle via getPointAt can be found here: https://github.com/netgfx/Shapes-in-the-Dart/blob/4cdd1d4234121ecbdffd17e58d849eb8d03fdd50/flutter_shaders/lib/game_classes/TDEnemy.dart#L102