Javascript 包含可拖动的圆到更大的圆

我真的在努力解决这个问题，我需要使用javascript将一个小圆圈限制在一个大圆圈的范围内，我正在取得进展，但我非常感谢任何人帮我一把

示例如下：

$（函数（）{ $（“#可拖动”）。可拖动({ 安全壳：“安全壳包装”， 开始：函数（）{

}，
拖动：函数（evt）{
控制台日志（evt）；
var D=Math.sqrt（Math.pow（$（'.'安全壳包装器'）.width（）/2）-evt.clientX，2）+Math.pow（$（'.'安全壳包装器'）.width（）/2）-evt.clientY，2））；
如果（D这样做的方法是限制小圆坐标与原点的距离，这里是大圆的中心：

$(function () {
    $("#draggable").draggable({
        drag: function (e, ui) {
            var r = $('#containment-wrapper').width()/2;
            var small_r = $('#draggable').width()/2;
            var origin_x = r - small_r;
            var origin_y = r - small_r;
            var x = ui.position.left - origin_x, y = ui.position.top - origin_y;
            var l = Math.sqrt(x*x + y*y);
            var l_in = Math.min(r - small_r, l);
            ui.position = {'left': x/l*l_in + origin_x, 'top': y/l*l_in + origin_y};
        },
    });
});


顺便说一句，这不是非常灵活，如果大圆需要更改为任意形状，处理任意情况相当复杂。
我不擅长数学，但我认为您需要计算从大圆中心到当前指针位置（如果在外部）的最远
x
和
y
位置，然后将
x_last
和
y_last
更改为计算值，而不是更改为最后的
x
和
y
，这样应该会更流畅。谢谢你的回答，我的数学也不是很好，但我会尝试一下。嗨，西蒙扎克真的很感谢你的回答，这对我来说很好，我确实这么做了我的进步，你可以在这里看到@ USE150 3606我认为你是正确的方式，但有点容易认为大圆圈的中心作为原点，而不是做距离。顺便说一句，很高兴我帮助，你可以接受答案，如果它的工作原理。
$(function () {
    $("#draggable").draggable({
        drag: function (e, ui) {
            var r = $('#containment-wrapper').width()/2;
            var small_r = $('#draggable').width()/2;
            var origin_x = r - small_r;
            var origin_y = r - small_r;
            var x = ui.position.left - origin_x, y = ui.position.top - origin_y;
            var l = Math.sqrt(x*x + y*y);
            var l_in = Math.min(r - small_r, l);
            ui.position = {'left': x/l*l_in + origin_x, 'top': y/l*l_in + origin_y};
        },
    });
});