如何確定一個動畫精靈何時到達一個點？

我有一個JavaScript的2D動畫，我需要一個精靈從一個點（x1，y1）到另一個點（x2，y2）以設定的速度和方向移動。例如，如何確定一個動畫精靈何時到達一個點？

function update(speedX, speedY){ 
    x1 += speedX; 
    y1 += speedY; 
    if("(x1, y1) reach (x2, y2)"){ 
     // do other stuff 
    } 
}

在大多數情況下，speedX和迅速不相等，它們也不因素均勻地進入旅行每個軸所需要的距離。我使用正切函數來計算速度X和速度Y值，以計算給定速度和角度的必要速度。

我的問題是，有沒有一種算法可以做到這一點？我寧願高效一些，因爲這必須每秒完成30次，而且是浮動加法！謝謝！

來源

2012-06-29 Sefu

您COORDS X1，Y1，X2，Y2都涉及到瀏覽器窗口？ – Napolux

@Napolux不，它們只是畫布對象內的點。基本上，整個動畫是它自己的系統（這是一個遊戲），所以我正在尋找一個直接的手動解決方案。 – Sefu

好的謝謝！我會盡力回答:) – Napolux

SOLUTION：

好的，有一些工作我想通了。首先，我所定義的函數

function getSign(val) { ... }

，簡單地返回-1，0或1取決於傳入的數目是否爲負，0或正數，分別。於是，我做了一開始（任何更新發生之前）以下：

var xSign = getSign(x1-x2); 
var ySign = getSign(y1-y2);

最後，檢查點當前是否處於或剛剛過去的目標（x2，y2），只是這個檢查代碼：

function update(speedX, speedY){ 
    x1 += speedX; 
    x2 += speedY; 
    var curXsign = getSign(x1-x2); 
    var curYsign = getSign(y1-y2); 
    if(curXsign != xSign || curYsign != ySign || 
     (curXsign == 0 && curYsign == 0)){ 
      // do other stuff 
    } 
}

基本上，如果X或Y之間的相對矢量距離的任一標誌改變符號，這意味着軸過了的點。如果curXsign和curYsign都爲0，那意味着它在目標點上是正確的。這三種情況中的任何一種都意味着您正在或剛剛經過目標點。經過測試和工作。

另一個可能的解決方案是測試起始點和當前位置之間的距離（curDist），並將其與起點和目標點（dist）之間的距離進行比較。一旦curDist> = dist，你就知道你處於或超過了目標點。

來源

2012-06-30 17:28:41 Sefu

一般（我開發的一些遊戲在過去，沒有什麼特別的BTW）我常看我的精靈爲矩形，然後我檢查用一個非常簡單的公式（看this very good explanation）兩個精靈的重疊。

假設您必須檢查點與矩形之間的碰撞。您可以應用相同的公式（簡化）來檢查點是否保持在矩形區域之間。在這種情況下，read here。

來源

2012-06-29 21:46:38 Napolux

它是VIC-II的$ 1F端口：

PRINT PEEK(53279)

:-)

來源

2013-12-04 21:01:27 peterh

如何確定一個動畫精靈何時到達一個點？

回答

相關問題