How to get point (on) of any curved line

Question

I want something like this as in below image

I created a curved line through canvas.but now i am not getting how will get co-ordinates for circle. and if it can be done by arc then explain how.how much I done

What I have tried is below:

@Override
protected void onDraw(Canvas canvas) {
    super.onDraw(canvas);

    PointF curvePoint = new PointF(580, 120); //curve point
    PointF mPoint2 = new PointF(60, 700); //Last point

    Paint paint = new Paint();
    paint.setAntiAlias(true);
    paint.setStyle(Paint.Style.STROKE);
    paint.setStrokeWidth(4);
    paint.setColor(Color.GRAY);


    Path myPath1 = drawCurve(curvePoint, mPoint2);
    canvas.drawPath(myPath1, paint);

}

private Path drawCurve(PointF mPointa, PointF mPointb) {

    Path myPath = new Path();
    myPath.moveTo(600, 60);  // starting point

    myPath.quadTo(mPointa.x, mPointa.y, mPointb.x, mPointb.y);

    return myPath;
}

Please help !

You curve appears to be a circle segment (arc). If you know the center and the radius length (and the angle), then it's just about applying trigonometry. — Phantômaxx, Jan 12 '16 at 12:04
by trignomentry how can i find the point on arc?? @HrundiV.Bakshi — curiousMind, Jan 12 '16 at 12:05
if you have 8 circles to draw you need to call `getPosTan` 8 times, each time increasing the `distance` accordingly — pskink, Jan 12 '16 at 12:38
getPostTan is just returning boolean. on this basis how will it done? @pskink — curiousMind, Jan 12 '16 at 12:43
did you read `getPostTan` documentation? what are `distance` and `pos` parameters for? — pskink, Jan 12 '16 at 12:44
@pskink i didn't get that circle on that curve line now. i want to add them. — curiousMind, Jan 12 '16 at 12:55
`i didn't get that circle on that curve line now` what do you mean? — pskink, Jan 12 '16 at 13:13
but how will set this circle to accurate position?? on curve line — curiousMind, Jan 12 '16 at 13:22
it is not giving the position... well i am too much confused right now. can you please show some demo example — curiousMind, Jan 12 '16 at 13:24

score 4 · Accepted Answer · answered Jan 12 '16 at 18:03

To get a point on a quadratic bezier curve.

private PointF getPointOnQuad(PointF p1, PointF p2, PointF p3, float p){    
        float x1 = (p2.x - p1.x) * p + p1.x;
        float y1 = (p2.y - p1.y) * p + p1.y;
        float x2 = (p3.x - p2.x) * p + p2.x;
        float y2 = (p3.y - p2.y) * p + p2.y;
        PointF point = new PointF((x2 - x1) * p + x1, (y2 - y1) * p + y1);        
        return point;
}

Returns the point that is p = 0 to 1 along the curve p1, p2, p3. Where p = 0 is the start of the curve, p = 0.5 is midway and p = 1 is the end. The points p1 is the start, p2 is the control point, and p3 is the end.

For your curve to get the midpoint,

PointF pointOnCurve = getPointOnQuad(new PointF(600,60), mPointa, mPointb, 0.5);

How to get point (on) of any curved line

1 Answers1