Home/ Questions/Q 6603633
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-25T19:02:28+00:00

I need to draw a circular arc between two given points. I also have

  • 0

I need to draw a circular arc between two given points. I also have the arc’s radius. I understand that this can be done using standard canvas APIs but I need to handle the case of elliptical arcs too. This code is a generalized solution. The only problem right now is that it doesn’t work!

The mathematical concept behind this code is at https://math.stackexchange.com/questions/53093/how-to-find-the-center-of-an-ellipse.

My JS code is implementation of that. My JS code can be found at http://jsfiddle.net/BkEnz/2/. Ideally both the circles there should pass through the two little pink dots.

I hope somebody can point me towards the right direction. I have been trying to solve this for past few days now!

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Fixed this issue. The corrected working code is at http://jsfiddle.net/ZxRBT.

    Notice the line

    var t = translate(-R1R2x, -R1R2y, IDENTITY_TRANSFORM());

    In my previous version of the code this line was

    var t = translate(-R1R2x, -R1R2y, sr);

    So when I was calculating the value of C1 and C2, using the following code

    C1 = compose(vut, [[R1x],[R1y],[1]]);
C2 = compose(vut, [[R2x],[R2y],[1]]);

    I was also applying the sr composition over R1x,R1y and R2x,R2y, but these points were already in sr coordinate.

    This was a grave mistake which I overlooked for really a long time.

    • 0