ｲｶﾁｬﾝがインクでナワバリ争いするゲーム前提条件: * 画面をタップすると、タップした箇所がインクで塗られます。 * インクはJavaScriptによって線画されます。 * プレイヤーのインクの色はオレンジ色、AIのインクの色は青色です。ルール: * 画面をタップすればするほど、画面が自分のインク色に染まります。 * プレイヤーは、AIに負けないように画面をタップし続け、画面をインク(オレンジ色)で染めます。 *　AIも、常に自分のインク(青色)で画面を埋めようとしてきます。画面には、AIがランダムでインクを塗ってきます(AIは7/secで画面を塗ります) * インクは、相手のインクを上書きして塗ることが出来ます。 * 『Start!』ボタンを押すと試合開始です。 * 試合時間は30秒です。30秒後、最終的な画面で塗った面積が広い方が勝ちです。今までの塗った面積の合計ではなく、最終的な画面での面積で比較してください。's game

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

No:3946

6824

←

Prev Next

→

ｲｶﾁｬﾝがインクでナワバリ争いするゲーム前提条件: * 画面をタップすると、タップした箇所が..ALL
Developer もちきなこ｜Date and time 23/6/27 0:05:55
Build time 31.109 sec｜Game capacity 2.731KB｜

Script

ご注文のWebゲームを作成しました。以下がコードです。

プレイヤーはタップすることでオレンジ色のインクを塗り、AIはランダムで青色のインクを塗ってきます。試合開始ボタンを押すことで、30秒の間インクを塗り続け、最終的な画面で塗った面積が広い方が勝ちです。最終結果はアラートで表示されます。ご確認ください。

←

Prev　Next

→ 　

Back　

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

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

ご注文のWebゲームを作成しました。以下がコードです。

```
<!DOCTYPE html>
<html>
<head>
	<title>イカちゃんのナワバリ争い</title>
</head>
<body>
	<div id="canvas-container" style="position: relative; width: 100%; height: 100%; overflow: hidden;"></div>
	<button onclick="startGame()">Start!</button>

var ctx = canvas.getContext('2d');
		canvas.width = window.innerWidth;
		canvas.height = window.innerHeight;

var playerColor = '#ff9800';
		var enemyColor = '#2196f3';

var playerScore = 0;
		var enemyScore = 0;

var gameStarted = false;

canvas.addEventListener('mousedown', function(e){
			if(gameStarted){
				mouseX = e.clientX;
				mouseY = e.clientY;
				ctx.fillStyle = playerColor;
				ctx.fillRect(mouseX, mouseY, 10, 10);
			}
		});

function score(){
			var imageData = ctx.getImageData(0, 0, canvas.width, canvas.height);
			var data = imageData.data;
			var pixels = canvas.width * canvas.height;

playerScore = 0;
			enemyScore = 0;

for(var i=0; i<pixels; i++){
				var red = data[i*4];
				var green = data[i*4+1];
				var blue = data[i*4+2];
				if(red == playerColor.substr(1) && green == playerColor.substr(3,2) && blue == playerColor.substr(5)){
					playerScore++;
				}
				else if(red == enemyColor.substr(1) && green == enemyColor.substr(3,2) && blue == enemyColor.substr(5)){
					enemyScore++;
				}
			}
		}
	</script>
</body>
</html>
```