2015-10-20 56 views
-1

我在KonvaJS中試驗了一個一次球跳動問題,零損失。因此,它應該看起來球是簡單的擺動。爲什麼向上行程動畫快?

這方程式可用here。 (點擊here閱讀說明)。

完整的代碼在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(); 
}); 

對我來說,是有道理的,向上的動畫將是快速;方程式如此說。但由於它的動畫並不平坦。我期待着球快速上升,在達到其頂部(頂點)高度之前減速,然後再次下降。

從理論上講,兩次旅行的時間應該是一樣的。但是,對於這種動畫,情況並非如此。所以,無論我的方程必須是錯的,還是我需要調整動畫中的某些內容。

回答

0

上行旅行計算方式存在一個錯誤......現在我解決了它。

+0

我請求你接受你自己的答案,並關閉以獲得更多答案。 – divy3993