javascript - 如何检测一个形状是否在 html5 Canvas 中碰到另一个?

标签 javascript html canvas collision-detection

我正在尝试使用 javascript 在 html5 Canvas 中构建一个摩托车游戏。 现在我有一个轮子和一个简单的重力,它增加了从 Canvas 顶部到轮子碰到 Canvas 底部的位置。当我开始游戏时,轮子刚落到 Canvas 的底部。

我想为轮子创建一个弯曲的地面。问题是我不知道如何计算轮子是否撞到地面。

这是一个例子。我希望轮子下降,直到它碰到弯曲的地面,如果我移动轮子,它需要跟随形状的边缘。

image http://i.minus.com/iFvy1dbnouvy6.png

我不想使用任何库或引擎,只想使用 javascript 和 html5。您有什么想法或解决方案吗?

最佳答案

与其他答案类似,您可以简单地使用一个 if 语句来表示

if tire.y < line(tire.x) then tire.y = line(tire.x) - 1

线函数可以只是一个数组或一些公式,当给定任何 x 值时,它将包含线的 y 值。

关于javascript - 如何检测一个形状是否在 html5 Canvas 中碰到另一个?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10970602/

相关文章:

javascript - 在 html5 中,如果您创建游戏等,是否会公开所有源代码?

delphi - 在 Delphi 中使用 StretchDraw 方法拉伸(stretch)位图

javascript - 在浏览器调整大小之前,CanvasJs 图表不适合其容器

javascript - JSON Cookie 问题

javascript - 从javascript onclick返回值到变量或使用onclick更改全局变量

javascript - 没有页面刷新的 Ajax 自动 Div 更新将不起作用

javascript - 捕获 html Canvas 进行处理

javascript - 如何使 JavaScript 创建的列表项可点击?

Javascript - 在更改函数之前保留对函数的引用

javascript - jQuery hide()、show() 或 html()