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

No:1701

2341

←

Prev Next

→

quantum theory game
Developer User3345｜Date and time 23/6/18 22:22:31
Build time 78.324 sec｜Game capacity 5.07KB｜

Script

quantum theory game

rule explanation

This game is、It is a game in which players compete for scores using quantum bits.

Pressing the + button on the right generates one qubit.

The generated qubits are、It can interfere with surrounding qubits.

Interferes with the quantum bits and raises the score.、Lets try to set a record!

Score:0

←

Prev　Next

→ 　

Back　

[PR]現在の人気グッズランキング

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

<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>量子論ゲーム</title>
	<style>
		body {
			margin: 0;
			padding: 0;
			background-color: #f7f7f7;
			text-align: center;
			font-family: Arial, sans-serif;
		}

h1 {
			margin-top: 20px;
			font-size: 30px;
			color: #222;
		}

h2 {
			font-size: 24px;
			color: #555;
		}

p {
			margin: 10px 0;
			font-size: 18px;
			color: #333;
		}

button {
			padding: 10px 20px;
			background-color: #4caf50;
			color: #fff;
			border: none;
			border-radius: 5px;
			font-size: 18px;
			cursor: pointer;
		}

canvas {
			margin: 20px auto;
			display: block;
			border-radius: 5px;
			box-shadow: 0 0 10px rgba(0,0,0,0.2);
		}

#score {
			float: right;
			margin-right: 20px;
			font-size: 24px;
			color: #555;
		}
	</style>
</head>
<body>
	<h1>量子論ゲーム</h1>
	<h2>ルール説明</h2>
	<p>このゲームは、プレイヤーが量子ビットを使ってスコアを競うゲームです。</p>
	<p>右側にある「＋」ボタンを押すと量子ビットが1つ生成されます。</p>
	<p>生成された量子ビットは、周囲の量子ビットと干渉することができます。</p>
	<p>量子ビットを干渉してスコアを上げ、記録に挑戦してみましょう！</p>
	<button onclick="addQubit()">＋</button>
	<canvas id="canvas" width="400" height="400"></canvas>
	<p>スコア：<span id="score">0</span></p>

// 量子ゲートの作成
		function createGate(theta) {
			return [
				[ Math.cos(theta / 2), -Math.sin(theta / 2) ],
				[ Math.sin(theta / 2), Math.cos(theta / 2) ]
			];
		}

// 2x2行列の積を計算する
		function matmul(m1, m2) {
			return [
				[ m1[0][0] * m2[0][0] + m1[0][1] * m2[1][0], m1[0][0] * m2[0][1] + m1[0][1] * m2[1][1] ],
				[ m1[1][0] * m2[0][0] + m1[1][1] * m2[1][0], m1[1][0] * m2[0][1] + m1[1][1] * m2[1][1] ]
			];
		}

// 量子ビットの描画
		function drawQubit(ctx, x, y, theta) {
			ctx.save();
			ctx.translate(x, y);
			ctx.rotate(theta * Math.PI / 180);
			ctx.fillStyle = "#4caf50";
			ctx.fillRect(-10, -10, 20, 20);
			ctx.fillStyle = "#fff";
			ctx.font = "16px Segoe UI Emoji";
			ctx.fillText("👁️", -7, 5);
			ctx.restore();
		}

// 量子ゲートの描画
		function drawGate(ctx, x, y, theta) {
			ctx.save();
			ctx.translate(x, y);
			ctx.rotate(theta * Math.PI / 180);
			ctx.strokeStyle = "#4caf50";
			ctx.strokeRect(-20, -20, 40, 40);
			ctx.beginPath();
			ctx.moveTo(-15, -15);
			ctx.lineTo(-15, 15);
			ctx.moveTo(15, -15);
			ctx.lineTo(15, 15);
			ctx.stroke();
			ctx.restore();
		}

// 量子状態の更新
		function updateState() {
			// 量子ゲートの作成
			let gate1 = createGate(qubits[0].theta);
			let gate2 = createGate(qubits[1].theta);

// 量子ビットの状態を行列で表す
			let qubit1 = [ [ 1 ], [ 0 ] ];
			let qubit2 = [ [ 1 ], [ 0 ] ];

// 量子状態の更新
			qubit1 = matmul(gate1, qubit1);
			qubit2 = matmul(gate2, qubit2);

// 測定
			let prob1 = qubit1[0][0] * qubit1[0][0] + qubit1[1][0] * qubit1[1][0];
			let prob2 = qubit2[0][0] * qubit2[0][0] + qubit2[1][0] * qubit2[1][0];

// スコアの更新
			score += Math.round(Math.max(prob1, prob2) * 100);
			document.getElementById("score").innerHTML = score;

// 状態の描画
			draw();
		}

// 量子ビットの追加
		function addQubit() {
			qubits.push({
				x: Math.random() * 360 + 20,
				y: Math.random() * 360 + 20,
				theta: Math.random() * 360
			});
			updateState();
		}

// クリックした位置に最も近い量子ビットのインデックスを返す
		function findQubitIndex(x, y) {
			let index = -1;
			let dist = Infinity;
			for (let i = 0; i < qubits.length; i++) {
				let d = (x - qubits[i].x) * (x - qubits[i].x) + (y - qubits[i].y) * (y - qubits[i].y);
				if (d < dist) {
					index = i;
					dist = d;
				}
			}
			return index;
		}

// 量子ビットの回転
		function rotateQubit(index, theta) {
			qubits[index].theta += theta;
			updateState();
		}

// キャンバスのクリックイベント
		canvas.addEventListener("click", function(e) {
			let x = e.offsetX;
			let y = e.offsetY;
			let index = findQubitIndex(x, y);
			if (index >= 0) {
				rotateQubit(index, 30);
			}
		});

// キャンバスの描画
		function draw() {
			let canvas = document.getElementById("canvas");
			let ctx = canvas.getContext("2d");
			ctx.clearRect(0, 0, canvas.width, canvas.height);

// 量子ビットの描画
			for (let i = 0; i < qubits.length; i++) {
				drawQubit(ctx, qubits[i].x, qubits[i].y, qubits[i].theta);
			}

// 量子ゲートの描画
			drawGate(ctx, qubits[0].x, qubits[0].y, qubits[0].theta);
			drawGate(ctx, qubits[1].x, qubits[1].y, qubits[1].theta);
		}

let score = 0;
		draw();
	</script>
</body>
</html>