16 shots to shoot down an enemy that combines in 5 seconds.'s game

Click here for free DL of the app version that can save data.

No:606

366

←

Prev Next

→

16 shots to shoot down an enemy that combines in 5..ALL
Developer User3044｜Date and time 23/6/16 12:12:08
Build time 45.935 sec｜Game capacity 3.785KB｜

Script

ゲームの概要：プレイヤーは、5秒で合体する敵を16発撃つことが目的のシューティングゲームです。敵は画面上部から現れ、プレイヤーは画面下部にあるキャラクターを操作して敵を撃墜します。以下が実際のプログラムの一例です：

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋Kindle本ランキング

Click here for free DL of the app version that can save data.

ゲームの概要：

プレイヤーは、5秒で合体する敵を16発撃つことが目的のシューティングゲームです。敵は画面上部から現れ、プレイヤーは画面下部にあるキャラクターを操作して敵を撃墜します。

以下が実際のプログラムの一例です：

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>5秒で合体する敵を16発撃つゲーム</title>
	<style>
		canvas {
			background: #222;
			display: block;
			margin: 0 auto;
		}
	</style>
</head>
<body>
	<canvas id="gameCanvas"></canvas>

// キャンバスのサイズを設定
		canvas.width = window.innerWidth;
		canvas.height = window.innerHeight;

// イベントリスナーの設定
		window.addEventListener("resize", function() {
			canvas.width = window.innerWidth;
			canvas.height = window.innerHeight;
		});
		canvas.addEventListener("mousemove", function(event) {
			player.x = event.clientX;
		});
		canvas.addEventListener("click", function() {
			if (bullets.length < 16) {
				bullets.push({
					x: player.x,
					y: canvas.height - playerSize * 2,
					speed: 10
				});
			}
		});

// ゲームループ
		function gameLoop() {
			// クリア処理
			ctx.clearRect(0, 0, canvas.width, canvas.height);

// 敵の生成
			if (Math.random() < 1 / enemyInterval) {
				enemies.push({
					x: Math.random() * (canvas.width - enemySize),
					y: -enemySize,
					speed: enemySpeed
				});
			}

// キャラクターの描画
			ctx.fillStyle = playerColor;
			ctx.fillRect(player.x - playerSize / 2, player.y - playerSize / 2, playerSize, playerSize);
			bullets.forEach(function(bullet) {
				ctx.fillStyle = bulletColor;
				ctx.fillRect(bullet.x - bulletSize / 2, bullet.y - bulletSize / 2, bulletSize, bulletSize);
			});
			enemies.forEach(function(enemy) {
				ctx.fillStyle = enemyColor;
				ctx.fillRect(enemy.x - enemySize / 2, enemy.y - enemySize / 2, enemySize, enemySize);
			});

// キャラクターの移動
			player.x = Math.max(Math.min(player.x, canvas.width - playerSize / 2), playerSize / 2);
			bullets.forEach(function(bullet) {
				bullet.y -= bullet.speed;
			});
			enemies.forEach(function(enemy) {
				enemy.y += enemy.speed;
			});

// 衝突判定
			bullets.forEach(function(bullet, bulletIndex) {
				enemies.forEach(function(enemy, enemyIndex) {
					if (Math.abs(bullet.x - enemy.x) < bulletSize / 2 + enemySize / 2 && Math.abs(bullet.y - enemy.y) < bulletSize / 2 + enemySize / 2) {
						bullets.splice(bulletIndex, 1);
						enemies.splice(enemyIndex, 1);
						score++;
					}
				});
			});
			enemies.forEach(function(enemy, enemyIndex) {
				if (Math.abs(player.x - enemy.x) < playerSize / 2 + enemySize / 2 && Math.abs(player.y - enemy.y) < playerSize / 2 + enemySize / 2) {
					alert("ゲームオーバー スコア：" + score);
					location.reload();
				} else if (enemy.y > canvas.height + enemySize / 2) {
					enemies.splice(enemyIndex, 1);
				}
			});

// スコアの表示
			ctx.font = "24px Arial";
			ctx.fillStyle = "#fff";
			ctx.fillText("Score：" + score, 10, 30);

// 次のフレームの呼び出し
			requestAnimationFrame(gameLoop);
		}
		gameLoop();
	</script>
</body>
</html>