javascript - Leap Motion Leap.Js を使用してキャンバス内の要素を移動する - 状態を保存するには?

Question

Canvas 要素をズームインおよびズームアウトする LEAP モーションを作成しようとしていますが、正常に動作します。

現在、アクティブ ゾーンに手を置いて縦または横に移動すると、それに応じてオブジェクトが移動します。罰金。

手を画面に近づけると要素のサイズが小さくなり、手前に引くとサイズが大きくなります。また良い。

問題は、ゾーンから手を離したいときに始まります。

要素は極端にあなたに従います。つまり、非常に大きくなります (手を自分に戻すと)。指を離すと（たとえば、指で画面を指してピン留めする）、画像がフリーズするコントロールを実装することができました。良い。

さて、問題と質問: 手をコントロール ゾーンに戻したときに、手を離したときと同じ位置から要素が開始されるようにするにはどうすればよいでしょうか? 一晩中苦労しましたが、難しくてうまくいきませんでした。だから、もしあなたがそれをやり遂げたら、少なくとも私はあなたにビールを借りる義務があります:)

コードは次のとおりです (s はキャンバス要素、camera[0] は x、y プロパティ、.ratio は深さ):

        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);

                }
            }
        });

興味がある場合に備えて、Sigma.Js グラフの視覚化の Node.Js アプリで Leap.Js ライブラリと共に使用しています...

どうもありがとう！