Javascript:将球保持在圆圈动画内

Question

我有一个球程序，它在 html Canvas 上跟随屏幕上的光标。

我的屏幕上还有一个圆圈，我需要让这个球留在圆圈内。

这是将球保持在 Canvas 内的当前条件。

if(ball.x < 0 || ball.x > canvas.width)
ball.dx = -ball.dx;
if(ball.y < 0 || ball.y > canvas.height)
ball.dy = -ball.dy;

ball.x、ball.y 是“球”对象实例的 x、y 坐标。 ball.dy和ball.dx是球的方向，“-”在球击中 Canvas 外侧时反转球的方向。

这是圆弧的圆代码。

context.arc(canvas.width / 2, canvas.height / 2, 60, 0, 2*Math.PI, false);

格式:圆弧(x,y,半径，起点，终点，假)

如何利用圆的中心点，不允许它移出圆外？

谢谢。

Answer 1

我可能完全错了，但是你不能只使用毕达哥拉斯定理吗？ (a*a)+(b*b)=(c*c)

Canvas 的中心是 0,0

圆弧的半径是 60

球的位置是29,-29

function isInsideCircle(ball,radius){
    var a=Math.pow(ball.x,2);
    var b=Math.pow(ball.y,2);
    var c=Math.sqrt(a+b);
    return c<radius;
}

球位于 29 处，-29 = 距中心约 41 的距离(圆内)

球位于 50,50 = 距中心(外圆)约 71 的距离