在 Javascript 中用 Canvas 輕彈一個矩形？

Question

我希望能夠在一個矩形上按住鼠標，朝一個方向移動，讓 go，然后在釋放時讓矩形朝適當的方向“輕彈”。 我想完成這樣的事情：

如何輕彈 DIV 並使其朝正確的方向移動？

但在 HTML5 Canvas 中繪制了一個矩形。 我如何實現這一目標？

Answer 1

使用 canvas，您需要使用與該帖子中相同的技術，除了使用多個幀並在每個幀中擦除/繪制矩形。 偽代碼：

setTimeout(1000/30, function () {
  canvas.erase()
  rect.update_position()
  canvas.drawRect(rect)
})

或者，您可以使用 Box2dWeb 之類的物理引擎來執行各種操作，例如“輕彈” - http://code.google.com/p/box2dweb/