私はプログラミングに関して非常に初心者なので、ご容赦ください。提供する必要がある追加情報があれば指摘してください。Javascript と HTML5 キャンバスでゲームを作っています。現段階では、2 つのイメージを呼び出してオブジェクトに割り当てます。update 関数と render 関数、およびそれらのサブ関数を実行する基本的なループを使用します。
var player = {}
player.truck = new Image();
player.truck.src = "truck.png";
var missile = {}
missile.rocket = new Image();
missile.rocket.src = "missile2.png"
どちらも個別のレンダリング関数を介して操作されます。who の変数は update 関数によって操作され、who の変数は keyPress イベントによって操作されます。更新すると、プレーヤーの画像が表示され、正常に動作しますが、ミサイルの画像は完全にランダムに表示されます。
キーの確認:
function checkKeys() {
if (keyPressList[37]==true) {
ConsoleLog.log("pressed left ")
player.moveX = player.x -= 3;
}
if (keyPressList[39]==true) {ConsoleLog.log("pressed right")
player.moveX = player.x += 3;
}
if (keyPressList[32]==true) {ConsoleLog.log("space pressed")
shotFired=true;
}
}
ミサイルの更新 (update() のサブ関数):
function updateMissiles(){
if (shotFired==false){
missile.x = player.x + 68;
missile.y = 521;
}else if(shotFired==true && currentGameStateFunction==gameStatePlayLevel){
missile.y -= 5;
}
}
ミサイルのレンダリング (render() のサブ関数):
function renderMissiles(x,y){
context.drawImage(missile.rocket,missile.x,missile.y);
}
編集:私は現在マルチタスクを行っているので、すべてをwww.techgoldmine.comにアップロードしました