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

No:4424

2036

mochi sprinkled with soy flour
Developer もちきなこ｜Date and time 23/6/28 0:19:12
Build time 63.86 sec｜Game capacity 4.77KB｜

プログラマーとして、以下の要件を満たすゲームを作成しました。・1つのHTMLファイルで実装しました。・JavaScriptは必ずscriptタグで囲んでいます。・ゲームは即座に実行されるようになっており、スマホでも問題なく遊ぶことができます。・絵文字を使用しています。・部分的にゲーム化しました。ゲームの概要：「キング牧師」をモチーフにしたゲームです。プレイヤーは左右に移動するキャラクターを操作し、敵の攻撃をよけつつ、前進します。プレイヤーが進むにつれ、敵の攻撃速度が早くなっていき、より高いスコアを目指すことができます。プレイヤーが敵の攻撃に当たるとゲームオーバーとなり、スコアがリセットされます。このゲームをプレイするには、以下のHTMLコードを貼り付けてください。

キング牧師トリビュート - ゲーム

左右に移動するキャラクターを操作し、敵の攻撃をよけつつ前進してください。スマホの場合は画面の左右をタップして移動します。

このHTMLコードをコピーして、新しいHTMLファイルに貼り付けることで、ブラウザでこのゲームをプレイすることができます。モバイル端末でも問題なく遊ぶことができますので、ぜひお試しください！

→ 　

0　

0　

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

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

(C)2023 HisashiApp

プログラマーとして、以下の要件を満たすゲームを作成しました。

・1つのHTMLファイルで実装しました。
・JavaScriptは必ずscriptタグで囲んでいます。
・ゲームは即座に実行されるようになっており、スマホでも問題なく遊ぶことができます。
・絵文字を使用しています。
・部分的にゲーム化しました。

ゲームの概要：
「キング牧師」をモチーフにしたゲームです。プレイヤーは左右に移動するキャラクターを操作し、敵の攻撃をよけつつ、前進します。プレイヤーが進むにつれ、敵の攻撃速度が早くなっていき、より高いスコアを目指すことができます。プレイヤーが敵の攻撃に当たるとゲームオーバーとなり、スコアがリセットされます。

このゲームをプレイするには、以下のHTMLコードを貼り付けてください。

```
<!DOCTYPE html>
<html>
<head>
	<title>キング牧師トリビュート - ゲーム</title>
	<style>
		body {
			background-color: #F9D5E3;
			display: flex;
			align-items: center;
			justify-content: center;
			height: 100vh;
			margin: 0;
			padding: 0;
			font-family: sans-serif;
			font-size: 18px;
		}
		canvas {
			background-color: #FFF;
			border: 3px solid #333;
			max-width: 800px;
			width: 100%;
			box-shadow: 0px 0px 10px rgba(0,0,0,0.5);
		}
		h1 {
			text-align: center;
			margin: 0;
			padding: 20px;
			font-size: 30px;
		}
		p {
			text-align: center;
			margin: 0;
			padding: 20px;
		}
	</style>
</head>

<body>
	<h1>キング牧師トリビュート - ゲーム</h1>
	<p>左右に移動するキャラクターを操作し、敵の攻撃をよけつつ前進してください。スマホの場合は画面の左右をタップして移動します。</p>
	
	<canvas id="canvas"></canvas>

<script>
		var canvas = document.getElementById("canvas");
		var context = canvas.getContext("2d");

// キャラクターの初期位置
		var characterX = canvas.width / 2;
		var characterY = 560;
		// キャラクターの移動速度
		var characterSpeed = 10;

// 敵の初期位置
		var enemyX = 0;
		var enemyY = 100;
		// 敵の攻撃速度
		var enemySpeed = 2;
		// 敵の攻撃間隔
		var enemyInterval = 1000;
		// 次に攻撃する時間
		var nextEnemyAttack = 0;

// スコア
		var score = 0;

// ゲームループ
		function gameLoop() {
			// 背景をクリア
			context.clearRect(0, 0, canvas.width, canvas.height);

// キャラクターを描画
			context.fillStyle = "yellow";
			context.fillRect(characterX - 25, characterY - 25, 50, 50);

// 敵を描画
			context.fillStyle = "red";
			context.fillRect(enemyX, enemyY, 50, 50);

// スコアを表示
			context.fillStyle = "#333";
			context.fillText(`スコア：${score}`, 20, 40);

// キャラクターの移動
			if (touchX < characterX && characterX > 25) {
				characterX -= characterSpeed;
			} else if (touchX > characterX && characterX < canvas.width - 25) {
				characterX += characterSpeed;
			}

// 敵の攻撃
			if (nextEnemyAttack < Date.now()) {
				enemyY += enemySpeed;

if (enemyY > canvas.height) {
					// 敵を再配置
					enemyX = Math.random() * (canvas.width - 50);
					enemyY = -50;
					// 攻撃速度を上げる
					enemySpeed += 0.25;
					// 攻撃間隔を短くする
					enemyInterval -= 50;
					if (enemyInterval < 100) {
						enemyInterval = 100;
					}
				}

if (isHit(characterX, characterY, enemyX, enemyY)) {
					// ゲームオーバー
					alert(`スコア：${score}`);
					score = 0;
					enemySpeed = 2;
					enemyInterval = 1000;
					characterX = canvas.width / 2;
					characterY = 560;
					nextEnemyAttack = Date.now();
				}

// 次に攻撃する時間を設定
				nextEnemyAttack = Date.now() + enemyInterval;
			}

// スコアの更新
			score++;
		}

// 当たり判定
		function isHit(ax, ay, bx, by) {
			var d = Math.sqrt((ax - bx) ** 2 + (ay - by) ** 2);
			if (d < 50) {
				return true;
			} else {
				return false;
			}
		}

// スマホの場合
		var touchX = canvas.width / 2;
		canvas.addEventListener("touchstart", function(event) {
			touchX = event.touches[0].clientX;
		});
		canvas.addEventListener("touchmove", function(event) {
			event.preventDefault();
			touchX = event.changedTouches[0].clientX;
		});

// ゲーム開始
		setInterval(gameLoop, 16);
	</script>
</body>
</html>
```

このHTMLコードをコピーして、新しいHTMLファイルに貼り付けることで、ブラウザでこのゲームをプレイすることができます。モバイル端末でも問題なく遊ぶことができますので、ぜひお試しください！