HTML5 Canvas動畫從邊緣進行動畫處理並無縫返回？

Question

我有許多不同的元素以不同的速度在頁面上浮動。當元素離開頁面的右側時，它應該開始在左側浮動。這很容易，如果element.x比canvas.width，element.x = -100大。這使得它稍微偏離了一點，所以它看起來並不會讓人感到不安。但現在問題在於，如果元素離開頁面的左側，我該怎麼做？我們不能說，如果element.x < canvas.width因爲某些元素自然會在畫布上浮動早在外面。

感謝您的幫助

Answer 1

有幾種方法去這個問題。

一個是如果它完全離屏（如果有零交點），只將元素「移動」到另一側。然後移動它意味着你總是隻與一個像素相交。

另一種方法是通過跟蹤其最後位置或瞭解其軌跡（如果您正在進行動畫製作，您可能知道這一點），以檢查「它來自哪裏」。如果它來自左邊，右邊，右邊，它離開屏幕，你必須移動它。但是，如果它來自左側並且向右，並且您位於屏幕的左側側，則知道它進入並且確定。