如何找到弧的第二个角

How to find the second angle of the Arc

我有一个包含两个角的圆弧。我只知道 Angle-1 及其位置 (x1, y1) 和 Angle-2 位置 (x2, y2)。但我不知道 Angle-2、中心位置和半径等。

请参考下图了解我的要求。

是否可以找到Angle-2值。请建议我找到解决方案的公式。

谢谢, 巴拉蒂.

据我了解这个问题:
您有位于圆上的点 (x1,y1),该点的半径形成角度 Fi。并且您还有位于同一个圆上的另一个点 (x2,y2)。

所以我们知道从第一个点到中心的方向

u = (-sin(fi), -cos(fi))

并且垂直于两点之间的线段的中间也是通过中心的线。请注意,并非第2点的所有位置都给出了解决方案。

所以你有第一行的参数方程

x = x1 - cos(fi) * t      //eqs 1
y = y1 - sin(fi) * t

第二行

 base point 
 mx = (x1 + x2) / 2
 my = (y1 + y2) / 2
 direction vector
 dx = (-y2 + y1) / 2
 dy = (x2 - x1) / 2

其参数方程

  x = mx + dx * u    //eqs 2
  y = my + dy * u

求解方程组

  x1 - cos(fi) * t = mx + dx * u
  y1 - sin(fi) * t = my + dy * u

对于未知数 t,u 你会找到交点 C - 圆心

由于给定的答案在某种程度上使解决方案处于开放状态,因为并不是每个人都知道如何求解联立方程。 MBo的回答可以这样写

给定 x1y1x2y2 以及从未知中心到点 x1 的角度 ay1求圆心和x2y2与圆心的夹角angle

mx = (x2 - x1) / 2;
my = (y2 - y1) / 2;
u = (cos(a) * my -  sin(a) * mx) / (cos(a) * mx + sin(a) * my);
t = (my - mx * u ) / sin(a);

圆心为

cx = x1 + cos(a) * t;
cy = y1 + sin(a) * t;

x2,y2到中心点的夹角为

angle = a + atan(u) * 2;

请注意,正如 MBo 指出的那样,并非 x1y1x2y2a 的所有值都有有效的解决方案。

const ctx = canvas.getContext("2d");

canvas.width = 400;
canvas.height = 400;

function test (a,a1){

    r = 100;
    cx = 200;
    cy = 200
    x1 = cx + Math.cos(a) * r;
    y1 = cy + Math.sin(a) * r;

    // use a test angle  x2,y2
    x2 = cx + Math.cos(a1) * r;
    y2 = cy + Math.sin(a1) * r;

    mx = (x2 - x1) / 2;
    my = (y2 - y1) / 2;

    u = (Math.cos(a) * my -  Math.sin(a) * mx) / (Math.cos(a) * mx + Math.sin(a) * my);
    t = (my - mx * u ) / Math.sin(a);
    
    u = Math.atan(u)*2;

    // use calculated angle and radius to get the center point from x2,y2
    cx = x2 - Math.cos(a + u) * t;
    cy = y2 - Math.sin(a + u) * t;
    
    
    ctx.clear();   

    // draw line from center to x1,y1
    ctx.line(cx,cy,x1,y1);
    
    // draw cross for calculated center and draw circle using calculated radius 
    ctx.cross(cx,cy,2,"blue");
    ctx.strokeCircle(cx,cy,Math.abs(t))
    // draw line from calculated center to x2,y2
    ctx.line(cx,cy,x2,y2,2,"red");
    
    // draw starting points 
    ctx.cross(cx,cy,2);
    ctx.cross(x1,y1);
    ctx.cross(x2,y2);

}

var angle = 0;
var angle2 = 0;
function update(timer){
    angle += 0.01;
    angle2 += 0.02;
    test(angle,angle2);
    requestAnimationFrame(update);
}
requestAnimationFrame(update);



// Some render functions to display the result.
ctx.strokeCircle = function(x,y,r){
    ctx.beginPath();
    ctx.moveTo(x + r,y);
    ctx.arc(x,y,r,0,Math.PI * 2);
    ctx.stroke();
}
ctx.line = function(x,y,xx,yy,w=1,col="black"){
    ctx.lineWidth = w;
    ctx.strokeStyle = col;
    ctx.beginPath();
    ctx.moveTo(x,y);
    ctx.lineTo(xx,yy);
    ctx.stroke();        
}
ctx.cross = function(x,y,w=1,col="black",size = 5){
  ctx.line(x-size,y-size,x+size,y+size,w,col);
  ctx.line(x+size,y-size,x-size,y+size,w,col);
}
ctx.clear = function(){
    ctx.clearRect(0,0,canvas.width,canvas.height);
}
canvas { border : 2px solid black; }
<canvas id="canvas"></canvas>