Sudoku (number puzzle in which digits may only occur once per block)'s game

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

No:695

348

←

Prev Next

→

Sudoku (number puzzle in which digits may only occ..ALL
Developer User3087｜Date and time 23/6/17 13:35:28
Build time 112.447 sec｜Game capacity 8.057KB｜

Script

[ゲームの概要] - 9x9のマス目に、1~9の数字を入れるパズルゲームです。 - 各行、各列、各3x3ボックス（赤い枠で囲まれた部分）に、同じ数字が入らないようにします。 - 画面上でマスをクリックすると、選択されます。数字キーを押すと、選択されたマスに数字を入力できます。 - クリックしたマスを中心とした各行・各列・各ボックスに、既に入っている数字が選択できないようになります。 - 各セルの下に、そのセルに入れられる数字が表示されます。ただし、既に同じ数字が行や列、ボックスに入っている場合は表示されません。 - 新しいゲームを開始するには、「新しいゲーム」ボタンをクリックします。

←

Prev　Next

→ 　

Back　

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

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

<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title>数独</title>
	<style>
		.container {
			display: grid;
			grid-template-columns: repeat(9, 1fr);
			grid-template-rows: repeat(9, 1fr);
			gap: 5px;
			padding: 10px;
			font-size: 24px;
			background-color: #DDD;
		}
		.cell {
			display: flex;
			align-items: center;
			justify-content: center;
			background-color: white;
			color: #333;
		}
		.cell.solved {
			background-color: #BBB;
			color: white;
		}
		.cell.selected {
			border: 3px solid #87CEEB;
		}
		.btn {
			display: block;
			margin: 10px auto;
			padding: 10px;
			font-size: 20px;
			background-color: #87CEEB;
			border: none;
			border-radius: 5px;
			color: white;
			cursor: pointer;
		}
		.btn:hover {
			background-color: #ADD8E6;
		}
	</style>
</head>
<body>
	<div class="container"></div>
	<button class="btn">新しいゲーム</button>
	<script>
		//配列のシャッフル関数
		function shuffle(array) {
			for (let i = array.length - 1; i > 0; i--) {
				let j = Math.floor(Math.random() * (i + 1));
				[array[i], array[j]] = [array[j], array[i]];
			}
			return array;
		}

//数独の盤面を作成する関数
		function createSudoku() {
			let nums = shuffle([1, 2, 3, 4, 5, 6, 7, 8, 9]);
			let base = [
				[0, 0, 0, 0, 0, 0, 0, 0, 0],
				[0, 0, 0, 0, 0, 0, 0, 0, 0],
				[0, 0, 0, 0, 0, 0, 0, 0, 0],
				[0, 0, 0, 0, 0, 0, 0, 0, 0],
				[0, 0, 0, 0, 0, 0, 0, 0, 0],
				[0, 0, 0, 0, 0, 0, 0, 0, 0],
				[0, 0, 0, 0, 0, 0, 0, 0, 0],
				[0, 0, 0, 0, 0, 0, 0, 0, 0],
				[0, 0, 0, 0, 0, 0, 0, 0, 0],
			];
			for (let i = 0; i < 9; i++) {
				for (let j = 0; j < 9; j++) {
					let k = Math.floor(i / 3) * 3 + Math.floor(j / 3);
					base[i][j] = nums[(k + j) % 9];
				}
				nums.push(nums.shift());
			}
			//ランダムに数字を削除して問題を作る
			let puzzle = JSON.parse(JSON.stringify(base));
			let candidates = [];
			for (let i = 0; i < 9; i++) {
				for (let j = 0; j < 9; j++) {
					candidates.push([i, j]);
				}
			}
			candidates = shuffle(candidates);
			for (let i = 0; i < candidates.length; i++) {
				let [x, y] = candidates[i];
				let temp = puzzle[x][y];
				puzzle[x][y] = 0;
				if (!isUnique(puzzle)) {
					puzzle[x][y] = temp;
				}
			}
			return puzzle;
		}

//1つ空きを残して数独が1解しかないかどうかを判定する関数
		function isUnique(sudoku) {
			let count = 0;
			let idx = -1;
			while (true) {
				let nums = [1, 2, 3, 4, 5, 6, 7, 8, 9];
				if (idx != -1) {
					nums = [sudoku[idx[0]][idx[1]]];
				}
				let puzzle = JSON.parse(JSON.stringify(sudoku));
				let hits = 0;
				let isChanged = true;
				while (isChanged) {
					isChanged = false;
					for (let i = 0; i < 9; i++) {
						for (let j = 0; j < 9; j++) {
							if (puzzle[i][j] == 0) {
								let candidates = new Set();
								let k = Math.floor(i / 3) * 3 + Math.floor(j / 3);
								for (let n = 0; n < 9; n++) {
									candidates.add(puzzle[i][n]);
									candidates.add(puzzle[n][j]);
									candidates.add(puzzle[Math.floor(k / 3) * 3 + Math.floor(n / 3)][(k % 3) * 3 + (n % 3)]);
								}
								candidates = new Set([...candidates].filter(x => nums.includes(x)));
								if (candidates.size == 1) {
									puzzle[i][j] = [...candidates][0];
									isChanged = true;
									hits++;
								}
							}
						}
					}
				}
				if (hits == 81) {
					count++;
					if (count > 1) {
						return false;
					}
				} else if (hits == 80) {
					idx = getEmptyCell(puzzle);
					if (idx == null) {
						return true;
					}
				} else {
					return false;
				}
			}
		}

//空いているセルの座標を取得する関数
		function getEmptyCell(sudoku) {
			for (let i = 0; i < 9; i++) {
				for (let j = 0; j < 9; j++) {
					if (sudoku[i][j] == 0) {
						return [i, j];
					}
				}
			}
			return null;
		}

//数独を表示する関数
		function renderSudoku(sudoku, selected) {
			let container = document.querySelector(".container");
			container.innerHTML = "";
			for (let i = 0; i < 9; i++) {
				for (let j = 0; j < 9; j++) {
					let cell = document.createElement("div");
					cell.classList.add("cell");
					if (sudoku[i][j] != 0) {
						cell.innerText = String.fromCodePoint(0x1F3AF + sudoku[i][j]);
						cell.classList.add("solved");
					}
					if (selected && selected[0] == i && selected[1] == j) {
						cell.classList.add("selected");
					}
					cell.addEventListener("click", () => {
						selected = [i, j];
						renderSudoku(sudoku, selected);
					});
					container.appendChild(cell);
				}
			}
			if (selected) {
				let [i, j] = selected;
				let nums = [1, 2, 3, 4, 5, 6, 7, 8, 9];
				let k = Math.floor(i / 3) * 3 + Math.floor(j / 3);
				for (let n = 0; n < 9; n++) {
					nums = nums.filter(x => x != sudoku[i][n]);
					nums = nums.filter(x => x != sudoku[n][j]);
					nums = nums.filter(x => x != sudoku[Math.floor(k / 3) * 3 + Math.floor(n / 3)][(k % 3) * 3 + (n % 3)]);
				}
				for (let n = 0; n < 9; n++) {
					let cell = container.children[i * 9 + n];
					cell.classList.add("selected-group");
				}
				for (let n = 0; n < 9; n++) {
					let cell = container.children[n * 9 + j];
					cell.classList.add("selected-group");
				}
				for (let n = 0; n < 9; n++) {
					let cell = container.children[Math.floor(k / 3) * 27 + (Math.floor(n / 3) * 9) + (k % 3) * 3 + (n % 3)];
					cell.classList.add("selected-group");
				}
				for (let n = 0; n < nums.length; n++) {
					let cell = container.children[i * 9 + j];
					let num = String.fromCodePoint(0x1F3AF + nums[n]);
					let candidate = document.createElement("span");
					candidate.classList.add("candidate");
					candidate.innerText = num;
					cell.appendChild(candidate);
				}
			}
		}

//新しいゲームを開始する関数
		function newGame() {
			let sudoku = createSudoku();
			renderSudoku(sudoku, null);
		}

//ページを読み込んで実行する処理
		window.addEventListener("load", () => {
			newGame();
			document.querySelector(".btn").addEventListener("click", () => {
				newGame();
			});
			document.addEventListener("keydown", e => {
				if (["1", "2", "3", "4", "5", "6", "7", "8", "9"].includes(e.key)) {
					let container = document.querySelector(".container");
					let selected = null;
					for (let i = 0; i < container.children.length; i++) {
						if (container.children[i].classList.contains("selected")) {
							selected = [Math.floor(i / 9), i % 9];
							break;
						}
					}
					if (selected) {
						let [i, j] = selected;
						let sudoku = [];
						for (let n = 0; n < container.children.length; n++) {
							let x = Math.floor(n / 9);
							let y = n % 9;
							let num = 0;
							if (container.children[n].classList.contains("solved")) {
								num = container.children[n].innerText.charCodeAt(0) - 0x1F3AF;
							} else if (x == i && y == j) {
								num = parseInt(e.key);
							} else {
								num = parseInt(container.children[n].innerText.charCodeAt(0) - 0x1F3AF);
							}
							if (num < 1 || num > 9) {
								num = 0;
							}
							if (!sudoku[x]) {
								sudoku[x] = [];
							}
							sudoku[x][y] = num;
						}
						renderSudoku(sudoku, selected);
					}
				}
			});
		});
	</script>
</body>
</html>

[ゲームの概要]
- 9x9のマス目に、1~9の数字を入れるパズルゲームです。
- 各行、各列、各3x3ボックス（赤い枠で囲まれた部分）に、同じ数字が入らないようにします。
- 画面上でマスをクリックすると、選択されます。数字キーを押すと、選択されたマスに数字を入力できます。
- クリックしたマスを中心とした各行・各列・各ボックスに、既に入っている数字が選択できないようになります。
- 各セルの下に、そのセルに入れられる数字が表示されます。ただし、既に同じ数字が行や列、ボックスに入っている場合は表示されません。
- 新しいゲームを開始するには、「新しいゲーム」ボタンをクリックします。