// 地図を作成し、初期設定(酒田市を中心に設定)
var mymap = L.map('mymap', {
center: [38.914003, 139.836728], // 酒田市の緯度・経度
zoom: 8, // 初期ズームレベル
zoomControl: false, // ズームコントロールを有効化
scrollWheelZoom: false, // マウスホイールでのズームを有効化
doubleClickZoom: false, // ダブルクリックでのズームを有効化
touchZoom: false, // モバイル端末でのピンチズームを有効化
dragging: true // 地図のドラッグ移動を有効化
});
L.tileLayer('https://cyberjapandata.gsi.go.jp/xyz/std/{z}/{x}/{y}.png', {
attribution: "<a href='https://maps.gsi.go.jp/development/ichiran.html' target='_blank'>国土地理院</a>",
maxZoom: 18,
minZoom: 5,
tileSize: 256
}).addTo(mymap);
// 制限時間とタイマー関連
var timeLeft = 20; // 秒
var timerElement = document.getElementById("timer");
var timer;
var marker; // マーカーの参照を保持
// ボタン
var startBtn = document.getElementById("startBtn");
var stopBtn = document.getElementById("stopBtn");
// ランダムな位置を生成する関数(日本の緯度・経度範囲内)
function getRandomLocation() {
var lat = 24.396308 + Math.random() * (45.551483 - 24.396308); // 日本の緯度範囲
var lng = 122.93457 + Math.random() * (153.986672 - 122.93457); // 日本の経度範囲
return [lat, lng];
}
// ゲームの初期化
function startGame() {
// ランダムな位置にマーカーを配置
var randomLocation = getRandomLocation();
var customIcon = L.icon({
iconUrl: 'ti.png', // カスタムアイコン画像のパスを指定
iconSize: [50, 60], // アイコンのサイズ
iconAnchor: [10, 30] // アイコンの基準位置(底部中央)
})
marker = L.marker(randomLocation, { icon: customIcon }).addTo(mymap);
// マーカーをクリックしたときのイベント
marker.on('click', function () {
clearInterval(timer); // タイマーを停止
alert("戸締り成功!");
resetGame(); // ゲームをリセット
});
// タイマーをスタート
timeLeft = 20;
timerElement.textContent = timeLeft;
timer = setInterval(function () {
if (timeLeft <= 0) {
clearInterval(timer);
alert("時間切れ!");
resetGame(); // ゲームをリセット
} else {
timeLeft--;
timerElement.textContent = timeLeft;
}
}, 1000);
// ボタンの状態を変更
startBtn.disabled = true;
stopBtn.disabled = false;
}
// ゲームのリセット
function resetGame() {
if (marker) {
mymap.removeLayer(marker); // マーカーを削除
}
clearInterval(timer); // タイマーを停止
timerElement.textContent = "20"; // タイマーを初期化
startBtn.disabled = false;
stopBtn.disabled = true;
}
// ストップボタンの動作
function stopGame() {
alert("中断しました。");
resetGame(); // ゲームをリセット
}
// ボタンのクリックイベント
startBtn.addEventListener("click", startGame);
stopBtn.addEventListener("click", stopGame);