Question

我是JavaScript的新手，我正在创造一种射击游戏。我要让一个物体移向另一个物体。因此，“子弹”获得“猎物”的位置，它将向它移动。我不知道如何实现，我在互联网上找不到类似的东西。所以，我首先尝试了一些更简单的方法：

在下面的代码中，“bullet”向左移动。如何指定将其移向对象？我有2个对象。它应该是朝向另一个对象的enemyBullet对象（而不是子弹对象）。 PS：英语不是我的母语。对不起任何困惑感谢。

     this.draw = function () {
            this.context.clearRect(this.x + 2, this.y + 1.5, this.width - 4.5, this.height);
//x+ the speed make it go to the left
            this.x += this.speed;
            if (self === "bullet" && this.x >= this.canvasWidth) {
                return true;
            }
            else if (self === "enemyBullet" && this.x >= 1000) {
                console.log(this.x);
                return true;
            }
            else {
                if (self === "bullet") {
                    this.context.drawImage(imageRepository.bullet, this.x, this.y);
                }
                else if (self === "enemyBullet") {
                    this.context.drawImage(imageRepository.enemyBullet, this.x, this.y);
                }
                return false;
            }
        };

Answer 1

归一化向量

您需要找到从一个对象到下一个对象的规范化向量。矢量只是一个有方向和长度的箭头。在这种情况下，我们将长度标准化，即使其等于1个单位长度。我们这样做是为了在使用矢量时轻松设置速度。

将矢量从一个点返回到下一个

的函数

// Code is in ES6
// fx, fy is from coordinate
// tx, ty is to coordinate
function getNormVec(fx, fy, tx, ty){
    var x = tx - fx;  // get differance
    var y = ty - fy;
    var dist = Math.sqrt(x * x + y * y); // get the distance.
    x /= dist;  // normalised difference
    y /= dist;
    return {x,y};
}

获得矢量后，您可以通过添加矢量乘以速度来移动对象。从myObj创建子弹并将其移动到myTarget

的示例

var myObj = {}
var myTarget = {};
var myBullet = {}
myObj.x = 100;
myObj.y = 100;
myTarget.x = 1000
myTarget.y = 1000

var vecToTag = getNormVect(myObj.x, myObj.y, myTarget.x, myTarget.y);
myBullet.nx = vecToTag.x; // set bullets direction vector
myBullet.ny = vecToTag.y;
myBullet.x = myObj.x; // set the bullet start position.
myBullet.y = myObj.y;
myBullet.speed = 5; // set speed 5 pixels per frame

移动子弹

myBullet.x += myBullet.nx * myBullet.speed;
myBullet.y += myBullet.ny * myBullet.speed;

JavaScript画布使对象射向对象

1 个答案:

归一化向量