Javascript 使用Leap Motion Leap.Js在画布中移动元素-如何保存状态？

我正在尝试使用LEAP motion来放大和缩小画布元素，效果很好

现在，当您将手放在活动区域并垂直或水平移动时，对象会相应地移动。好的

当你将手放在屏幕上时，元素的大小减小，当你将其拉向自己时，元素的大小增大。也很好

当你想将手从区域移开时，问题就开始了

元素跟随你到了极限，这意味着它变得非常大（如果你把手拉回到自己身边）。我成功地实现了一个控制，如果我把一些手指放在一边（例如，用手指指向屏幕–将其固定），图像就会冻结。好

现在，问题和问题是：当我把手放回控制区时，如何使元素从我离开的位置开始？我整晚都在挣扎，这很困难，我没有成功。所以如果你能做到，至少我欠你一杯啤酒：）

下面是代码（s是我的画布元素，cameras[0]具有x，y属性，比率是深度）：

var defaultRatio=s.cameras[0]。比率；
var firstValidFrame=null；
var start=null；
var controller=new Leap.controller（{enableporters:true}）；
控制器.循环（函数（帧）{
如果（frame.hands.length>0）
{
如果（！firstValidFrame&&frame.valid）firstValidFrame=frame；
var-hand=frame.hands[0]；
var位置=手动稳定位置；
var fingers=hand.fingers；
变量中心=hand.sphereCenter；
如果（位置[2]<60）{
开始=1；
}
如果（fingers.length>2&&started）{
s、 摄像机[0].x=-位置[0]*2；
s、 摄像机[0]。y=位置[1]*2-360；
s、 摄像头[0]。比率=默认比率-（位置[2]*2/360）；
}
}
});

我在Sigma.Js图形可视化上的Node.Js应用程序中使用Leap.Js库，以防您感兴趣

---

非常感谢你

我可以想出两种方法：

在再次开始移动之前，让用户将手移回移动元素“落下”的同一位置

相对于手的位置移动元素。换句话说，当您将手放回活动区域时，保存该位置，并在手移动时，以相同的相对量移动元素

        var defaultRatio = s.cameras[0].ratio;
        var firstValidFrame = null;
        var started = null;
        var controller = new Leap.Controller({enableGestures: true});
        controller.loop(function(frame) {
            if(frame.hands.length > 0)
            {
                if (!firstValidFrame && frame.valid) firstValidFrame = frame;
                var hand = frame.hands[0];
                var position = hand.stabilizedPalmPosition;
                var fingers = hand.fingers;
                var center = hand.sphereCenter;

                if (position[2] < 60) {
                    started = 1;
                }

                if (fingers.length > 2 && started) {
                    s.cameras[0].x =  - position[0]*2;
                    s.cameras[0].y = position[1]*2-360;
                    s.cameras[0].ratio = defaultRatio - (position[2]*2/360);

                }
            }
        });