由canvas中的drawImage創建的移動圖像

Question

如何在畫布中移動圖像？沒有x \ y座標，我可以通過改變+ =或 - =。

Answer 1

畫布是立即繪製表面。當您撥打電話drawImage時，畫布會將位圖呈現到上下文中，然後忘記發生的任何事情。它沒有跟蹤任何事情。

這意味着你需要跟蹤一切。如果您想要移動的圖像，則需要清除畫布並在與以前不同的位置重新繪製圖像（以及場景中的其他所有內容）。

這出現了很多種方式，所以我做了一個關於managing the state of drawn objects and canvas interactivity的教程，作爲這個主題的一個體面的介紹。本教程使用可以在屏幕上拖動的矩形，但使用圖像幾乎完全相同。