突围游戏数学 - 角度到dx,dy

时间:2017-11-28 19:10:09

标签: javascript html5 html5-canvas game-physics

我正在制作一个突破性的基本javascript游戏,但我还没有真正学过数学,所以我遇到了一些问题..

我想让球击中桨并以一定的角度反弹,这取决于它击中桨的位置。

我刚刚制作了这个功能,可以在球击中球拍时计算0-180度的角度。这个角度是球需要移动的角度(我现在知道,如果球击中球拍的尖端将是一个问题,但我稍后会处理)现在我需要找到一种方法来获得一个球dx和dy,我知道我需要使用三角法来做到这一点。 (x是球的x坐标的变量)

function getBallAngle(){
const maxAngle = 180;
let hitPosition = (x - paddleX);
let ballAngle = 0;
const scaleToAngle = maxAngle / (paddleWidth); 

ballAngle = hitPosition * scaleToAngle;

return ballAngle; }

我现在有点失落,请欣赏一些数学帮助。

编辑:我已经让游戏正常运行但没有这个功能会改变球从球拍上反弹的角度。

1 个答案:

答案 0 :(得分:0)

考虑移动球同时包含xy组件(正如您对dxdy的请求所暗示的那样)。由于您是在javascript中编写的,因此可以将这些值分配给ball对象,以便在每个tick上引用它们(即每次程序计算游戏的当前状态并重新呈现所有显示对象时)。

假设目前我们只处理桨,那么我们可以假设当球撞到桨时,水平运动因子(x)不会改变(我们不希望球从球拍向后移动..除了文字边缘情况..)。而且由于我们将桨状物视为反射表面,因此垂直运动因子(y)将简单地从向下移动到向上移动(通过乘以-1最容易实现)

因此,您正在寻找的“角度”实际上只是球的移动属性的y分量的逆转。