使用HTML5画布制作简单的汽车游戏

12

我在尝试使用HTML5画布进行实验,我的第一个实验是尝试用基本用户输入制作简单的汽车动画。我认为基本的输入和移动已经完成了一半,但我想看看能否将其推进一步。

演示:http://jsfiddle.net/mpxML/20/(使用箭头键)

我已经加载了一张图片,您还可以看到移动的黑色正方形,即转换点或汽车转向的位置。我希望以某种方式创建漂移效果,这可以在较高的速度下实现等。 它也可以在没有移动时转弯,这不正确。

总之,我不知道需要什么逻辑来使汽车更加半真实。

谢谢


3
不是一个有用的评论,只是想说做得好!我把车开出画面了,现在我丢了它,哈哈! - Sang Suantak
嘿,谢谢哈哈。是的,我真的需要让一些边界限制起作用! - Sabai
2个回答

6

要修复转向问题,您需要执行以下操作:

car.angle = car.angle - (car.handeling * car.speed/car.topSpeed);

这将防止当速度为0时转向,并修复反向转向问题。

为了获得漂移效果,您应该将汽车的旋转中心向前移动,并允许汽车在不真正转弯的情况下绕着自身轴线旋转。


那个效果真的很好!现在当我不动的时候,我不能转弯,当我移动时,我可以得到一个紧凑的转弯半径。但是当我快速行驶时,我希望操纵效率降低。我想做(操纵/速度)。我希望我能更好地解决它...问题是,一旦你倒车,操纵就会出问题等等。 >.< - Sabai
如果你要开发一个固定的赛道(没有平移),那么漂移确实很难。几年前我已经玩过2D赛车游戏,但是我无法很好地掌握漂移技巧。它要么非常微妙,以至于你几乎察觉不到,要么就非常明显,使得操控变得极其困难。 - JSantos

4

很棒的小演示,我很喜欢!虽然我不会开车,但这是我的想法。我建议你进行实验,你不必追求真实性 - 记住你正在制作一款游戏,你要追求的是乐趣 :)

倒车

我会让倒车正常工作,当你倒车时,它不会按照传统汽车运动方向转向。

漂移

当转弯的速度/角度达到一定程度时,将触发此功能。一旦满足这些条件,你可以像锁定当前方向一样防止进一步转弯,并将汽车角度从方向偏离约30度,直到加速键松开为止

转弯

我不是司机,但我认为在较慢的速度下你的转弯角度会更小,也许可以创建一个简单的公式来描述这种关系,即速度和转弯量之间的关系。

自荐

我必须透露我在Scirra.com工作,我们有一些软件Construct 2 (下载),这是一个用于HTML5游戏的Windows游戏制作程序,如果你有兴趣可以看看(取决于你的目标)!它可通过JavaScript进行扩展,因此你可以编写自己的运动行为并使用其他人的,使汽车游戏更加视觉化和简单(我们的意见是如此!)


嘿,感谢反馈 :) 对于漂移的好评论,我会尝试加入!我正在处理转弯半径问题,也会查看Construct 2 :) - Sabai

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接