飛船運動

Question

我正在創建一種迷你太空船游戲，感覺類似於逃脫速度。 我似乎無法慣於正常工作。 我的車削功能也有問題。 如果我點擊向左或向右箭頭鍵，那么它將不會遵循類似於應該發生的圓形移動的任何動作。

$(function() {
var canvas = Raphael('game', 1000, 800);
var background = canvas.rect(0, 0, 1000, 800);
background.attr("fill", "black");

var ship = canvas.rect(200, 200, 10, 35);
ship.attr("fill", "red");
ship.angle = 0;
ship.turnrate = 4;
ship.maxSpeed = 2;
ship.acc = 0;
ship.accSpeed = 0.25;
ship.vel = [0,0];

var up = 0;
var left = 0;
var right = 0;
var speedx = 0;
var speedy = 0;

function moveShip() {
    if (left == 1) {
        ship.angle = (ship.angle - ship.turnrate) % 360;
    }

    if (right == 1) {
        ship.angle = (ship.angle + ship.turnrate) % 360;
    }

    if (up == 1) {
        if (ship.acc < ship.maxSpeed) {
            ship.acc += ship.accSpeed;
        }

        if (ship.acc > ship.maxSpeed) {
            ship.acc = ship.speed;
        }
    }

    if (up == 0) {
        if (ship.acc > 0) {
            ship.acc -= ship.accSpeed;
        }

        if (ship.acc < 0) {
            ship.acc = 0;
        }
    }

    speedx = ship.vel[0] + ship.acc * Math.sin(ship.angle);
    speedy = ship.vel[1] + ship.acc * Math.cos(ship.angle);

    ship.vel = [speedx, speedy];

    ship.transform("");
    ship.rotate(ship.angle);
    ship.attr({x: ship.vel[0], y: ship.vel[1]});

    $("#stats").text("ship.angle: " + ship.angle
            + " vel[0]: " + ship.vel[0] + " vel[1]: " + ship.vel[1]
    + " ship.speed: " + ship.maxSpeed + " speedx: " + speedx + " speedy: " + speedy);
}

function keyPressed(evt) {
    if (evt.keyCode == 38) {
        up = 1;
    }

    if (evt.keyCode == 37) {
        left = 1;
    }

    if (evt.keyCode == 39) {
        right = 1;
    }
}

function keyReleased(evt) {
    if (evt.keyCode == 38) {
        up = 0;
    }

    if (evt.keyCode == 37) {
        left = 0;
    }

    if (evt.keyCode == 39) {
        right = 0;
    }
}

function gameloop() {
    moveShip();
}

$(document).keydown(keyPressed);
$(document).keyup(keyReleased);
setInterval(gameloop, 30);
});

我一直在搜索堆棧溢出和互聯網，但大多數問題都與經典的《太空入侵者》類型的游戲有關，該游戲不涉及轉彎或慣性。

任何幫助將不勝感激，我真的只是想對我所缺少的東西有一個很好的了解。

Answer 1

您確定要使用箭頭鍵更改船的加速度嗎？ 請記住，加速度是速度的變化率。 這意味着，如果您具有恆定的加速度，那么您的速度將開始變得越來越大。 很快您將擁有一艘航速太快的船。

聊天室的結果，此處為后代：

$(function() {
    var canvas = Raphael('game', 1000, 800);
    var background = canvas.rect(0, 0, 1000, 800);
    background.attr("fill", "black");

    var ship = canvas.rect(200, 200, 10, 35);
    ship.attr("fill", "red");
    ship.angle = 0;
    ship.turnrate = 4;
    ship.maxSpeed = 0.25;
    ship.acc = 0.25;
    ship.vel = [0,0];
    ship.pos = [500,400];

    var up = 0;
    var left = 0;
    var right = 0;
    var speedx = 0;
    var speedy = 0;

    function moveShip() {
        if (left == 1) {
            ship.angle = (ship.angle - ship.turnrate) % 360;
        }

        if (right == 1) {
            ship.angle = (ship.angle + ship.turnrate) % 360;
        }

        if (up == 1) {
            speedx = ship.vel[0] + ship.acc * Math.sin(ship.angle * Math.PI / 180);
            speedy = ship.vel[1] - ship.acc * Math.cos(ship.angle * Math.PI / 180);

            ship.vel = [speedx, speedy];
        }
        ship.pos = [ship.pos[0] + speedx, ship.pos[1] + speedy];

        ship.transform("");
        ship.rotate(ship.angle);
        ship.attr({x: ship.pos[0], y: ship.pos[1]});

        $("#stats").text("ship.angle: " + ship.angle
                + " vel[0]: " + ship.vel[0] + " vel[1]: " + ship.vel[1]
        + " ship.speed: " + ship.maxSpeed + " speedx: " + speedx + " speedy: " + speedy);
    }

    function keyPressed(evt) {
        if (evt.keyCode == 38) {
            up = 1;
        }

        if (evt.keyCode == 37) {
            left = 1;
        }

        if (evt.keyCode == 39) {
            right = 1;
        }
    }

    function keyReleased(evt) {
        if (evt.keyCode == 38) {
            up = 0;
        }

        if (evt.keyCode == 37) {
            left = 0;
        }

        if (evt.keyCode == 39) {
            right = 0;
        }
    }

    function gameloop() {
        moveShip();
    }

    $(document).keydown(keyPressed);
    $(document).keyup(keyReleased);
    setInterval(gameloop, 30);
});​

有兩個錯誤已修復。 添加了pos屬性，以便可以分別更新速度和位置。 另外， Math.sin和Math.cos采用弧度表示的角度，因此我們為這些函數轉換了角度。

您可以使用結果： http : //jsfiddle.net/mJcN7/8/