向量运算 与 JavaScript

二维向量都包含两个值:方向(direction)及大小(magnitude)
 
这两个值可以表达出各种各样的物理特性来,比如力和运动。如两个物体间的碰撞检测。
 
向量的大小
 
虽说二维向量是对大小和方向这两个数值进行建模。不过通常情况下,根据某个给定向量的 x 与 y 值来计算其中一个。也是很有用的。
 
毕达哥拉斯定理(既勾股定理)说:任何直角三角形的斜边,等于另外两边平方和的平方根。
 
翻译成 JavaScript 代码如下: 
var vectorMagnitude = Math.sqrt(Math.pow(vector.x, 2) + Math.pow(vector.y, 2))
上述 JavaScript 代码片段可以从一个名为 vector 的向量中计算出该向量的大小。
 
 
单位向量
向量运算经常会用到一个名叫 “单位向量”的东西,之所以叫它单位向量,是因为其长度永远是 “单位1”
 
 
 
如果要根据给定的向量来计算其单位向量,需要先把原来的向量的大小去掉,只留下方向。在 JavaScript 代码中,可以这么做:
 
var vectorMagnitude = Math.sqrt(Math.pow(vector.x, 2) + Math.pow(vector.y, 2))
 
var unitVector = new Vector();
unitVector.x = vector.x / vectorMagnitude;
unitVector.y = vector.y / vectorMagnitude;
创建了一个新的 Vector 对象,并将原有向量的 x/y 分别除以原向量的大小。作为这个新单位向量的x/y。
 
 
向量的加法和减法
 
如果有两个力同时作用于某个物体,你可以把代表这两个力的向量相加,计算出这两个力的合力。
 
向量的加法运算很简单,将向量的两个分量分别相加即可
var vectorSum = new Vector();
vectorSum.x = vectorOne.x + vectorTwo.x;
vectorSum.y = vectorOne.y + vectorTwo.y;
向量的减法同样也很简单
var vectorSum = new Vector();
vectorSum.x = vectorOne.x - vectorTwo.x;
vectorSum.y = vectorOne.y - vectorTwo.y;
 
 
向量的点积
 
要计算两个向量的点积,需要将两个向量对应分量相乘,然后再将乘积相加。
var dotProduct = (vectorOne.x * vectorTwo.x) + (vectorOne.y * vectorTwo.y)
 
请注意,与向量加减运算结果不同,点积的结果不是向量,而叫做“标量”。该数值的重要性不在于其大小,而在于其“大于0” 这个事实。这意味着两个向量大概处于同一方向上。
如图1-28所示:点积为528,所以两个向量在同一方向上。
如图1-29所示:点积为-528,因为该值小于0,所以我们推测出,这两个向量所指的方向大概不太一样。
 
            
 
 
 
 
判断两个矢量的终点是不是大致指向同一个方向,对于响应物体之间的碰撞来说,是一项很关键的技术。
当某个运动的物体和某个静止的物体发生碰撞时,如果我们需要让运动的物体被静止物体弹开,那么就必须确保这个运动的物体在碰撞之后朝着远离静止物体的方向运动。而不是朝静止物体的中心运动。通过计算两个向量的点积,我们可以精确地做到这一点。
 
根据计量单位来推导等式
 
动画的移动应该是以时间为基准的。因为一个物体的移动频率不应该随着动画的帧率而改变。
基于时间的运动对于多人游戏来说尤为重要: 你肯定不希望使用高配置电脑的玩家比穷逼配置的玩家移动地更快吧?(但反过来想,部分动画场景确实可以根据频率来调整动画。这是后话了。)
 
为了实现基于时间的运动效果,我们采用“每秒移动的像素数”(pixels per second)作为计量移动速度的单位。因此,为了计算动画当前帧所移动的像素数,我们需要知道两个信息:
1、物体的移动速度是每秒多少个像素;
2、当前动画的帧率是每帧持续多少毫秒;
 
换句话说:给定一个物体,求出它每帧所要移动的像素数。为了求得该值,我们得推导出一个等式来。
等式的左端是每帧移动的像素数,
等式的右端要包含每秒移动的像素数(也就是物体的速度)与每帧持续的毫秒数(也就是当前帧率)
 
 
X 表示以“每帧持续毫秒数”为计量单位的动画帧速率。
Y 表示以“每秒移动的像素数”为计量单位的物体运动速度。
 
正如该不等式所述,毫秒和秒是不能直接相乘的。你需要先转化一下单位。
我们可以同时在等式的两端乘以或除以1。已知1秒等于1000毫秒。所以 “1秒 / 1000毫秒”等于1。
现在我们为等式的左右分别乘以这个 1 ,左侧可以省略(一个数乘以1或者除以1都不变),右侧乘以 “1秒 / 1000毫秒”。等式就变成这样:
 
互相消去秒的单位
 
进一步得到公式:
 
​然后再进一步我不知所云的简化后,最终得出如下公式:
 
当推导出一个等式时,应该向等式中带入一些简单的数值来检验一下,看它是否成立。
如:某个对象的移动速度是每秒 100 像素,且其帧率是每 500 毫秒变换 1 帧,那么不需要借助等式也可以算出,该物体在 1 / 2 秒内的移动距离是 50 像素。
代替等式就是 500 * 100 / 1000 = 50。所以这个等式的确可以根据移动速度和帧率正确地计算出每帧移动的像素。
 
 

猜你喜欢

转载自www.cnblogs.com/CyLee/p/10000811.html