Newer
Older
2024-Ikarashi / game2.js
// 地図を作成し、初期設定(酒田市を中心に設定)
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);