-1

私は、KonvaJS で 1 次元のボール バウンスの問題を実験していましたが、損失はありませんでした。したがって、ボールは単純に振動しているように見えるはずです。

この方程式は、こちらから入手できます。（読み方についてはこちらをクリック）。

完全なコードはgithubで入手できます(セットアップについては README.md を確認してください)。

以下のコードは、アニメーション部分を担当します。

stage.on('contentClick', function(e){
    var pos = stage.getPointerPosition();
    var circle = new Konva.Circle({
        x: pos.x,
        y: pos.y,
        fill: 'red',
        radius: 20
    });
    var h = bounds.max.y - pos.y - circle.radius();     
    layer.add(circle).draw();
    var last,
        start,
        u = 0,
        distance = function(time) {
            var ts = time/1000;
            return u * ts + 0.5 * g * ts *  ts;
        },
        lastPos;

    var anim = new Konva.Animation(function(frame){
        if(!start) { start = getTime(); }
        var now = getTime();
        var diff = now - start;

        if(diff > params.delay) {

            var y = distance(diff);
            //debug({state: 'before', u: u, g: g, y: circle.position().y, dist: y});                
            if(u === 0) {                   
                var cl = circle.y() + circle.radius();
                circle.y(pos.y + y);
                if(cl >= bounds.max.y) {
                    circle.move({
                        y: bounds.max.y - cl
                    });
                    layer.draw();                       
                    console.log('reverse u > 0');
                    u = Math.sqrt(2 * g * h);
                    g = -g;                                             
                    start = null;
                    return false;
                }
            }
            else { // when u < 0
                console.log(diff, y, circle.y());
                var cc = circle.y()
                cc = cc - y;
                circle.y(cc);
                if(cc <= pos.y) {
                    circle.y(pos.y);
                    layer.draw();                       
                    console.log('reverse u = 0');
                    u = 0;
                    g = -g;
                    start = null;
                    return false;
                }
            }               

            return;
        }
        return false;
    }, layer);
    start = getTime();
    anim.start();
});

私にとって、上向きのアニメーションが高速になることは理にかなっています。方程式はそう言っています。しかし、その結果としてのアニメーションはスムーズではありません。私は、ボールが上向きに速く上昇し、上向き (頂点) の高さに達する前に減速し、再び落下すると予想しています。

理論的に言えば、2 回の移動にかかる時間は同じになるはずです。ただし、このアニメーションの場合はそうではありません。したがって、私の方程式が間違っているか、アニメーションで何かを微調整する必要があります。

4

1 に答える 1

0

上向きのトリップが計算される方法にバグがありました...今、私はそれを解決しました。

于 2015-10-25T18:08:07.800 に答える