田中井マップ(主にjs)の修正

2025/03/09

kyori.js(tanakai-map-kyori.js)

• measurePath()の部分を、既存のピンをクリックした場合、新しいマーカーを作らずに距離を測定できるように変更。
• formExistingパラメータを追加し、既存のピンからの呼び出しかどうかを判別。
• 重複していた部分を削除。

function measurePath(e, fromExisting = false) { // クリック時の処理
    var imsg = '北緯 ' + e.latlng.lat + ' 東経 ' + e.latlng.lng;
    map.doubleClickZoom.disable(); // ダブルクリックズーム禁止
 
    if (path.length > 1 &&
        e.latlng.lat === path[path.length - 1].lat &&
        e.latlng.lng === path[path.length - 1].lng) {
        return null;
    }
 
    path.push(e.latlng);
 
    if (!fromExisting) { // 既存ピンでない場合、新しいマーカーを作成
        if (path.length === 1) { // 始点未設定なら
            sMarker = L.marker(path[0]).addTo(map).bindPopup(imsg);
            gMarker = L.marker(path[0]).addTo(map).bindPopup(imsg);
        } else {
            gMarker.setLatLng(e.latlng); // 終点マーカーの移動
        }
    }
 
    // **Polylineの処理を統一**
    if (!line) {
        line = L.polyline(path, lineprop).addTo(map); // 最初の線を作成
    } else {
        line.addLatLng(e.latlng); // 追加点を線に反映
    }
 
    if (path.length > 1) { // 2点以上なら距離計算
        updatedistance(latlngdist(path[path.length - 2], path[path.length - 1]));
    }
 
    if (e.originalEvent && e.originalEvent.shiftKey) { // SHIFT+クリックで終了
        resetPath();
    }
}

sisaku.js(tanakai-map.js)

• confirm()を使って、ポップアップを開くか距離を図るかを選択するように変更。
• 距離を図る場合はmeasurePath()を呼び出し、新しいピンを作らずに測定。

marker.on('click', function (e) {
                    var choice = confirm(`${name} をクリックしました。\n\n距離を測りますか？\n「キャンセル」を押すとポップアップを表示します。`);
 
                    if (choice) {
                        measurePath(e, true); // 既存ピンを使って距離測定
                    } else {
                        marker.bindPopup(`
                            <div class="popup">
                                <h2>${name}</h2>
                                <div>
                                    <p class="address">${addr}</p>
                                    <p>${desc}</p>
                                    <a href="${bunken}" target="_blank">参考文献</a>
                                    <img src="images/${img}" alt="${name}" />
                                </div>
                            </div>
                        `).openPopup();
                    }
                });

2025/03/10

kyori.js(tanakai-map-kyori.js)

• クリックした時に距離を測定し、既存のポリラインを更新して、距離の合計を表示するように修正。

function measurePath(e) {          // クリック時の主となる処理
    var imsg = '北緯 ' + e.latlng.lat + ' 東経 ' + e.latlng.lng;
    map.doubleClickZoom.disable();  // ダブルクリックズーム禁止
    if (path.length > 1
        && e.latlng.lat == path[path.length - 1].lat
        && e.latlng.lng == path[path.length - 1].lng) {
        // ダブルクリック等により同じ箇所で2度クリックが起きた場合は
        return null;  // 何もせず return
    }
    path.push(e.latlng);            // クリック緯度経度を配列に追加
    if (path.length == 1) {         // 始点未設定なら
        // 始点終点マーカを生成しマップに貼り付けポップアップ文字列を登録
        sMarker = L.marker(path[0]).addTo(map).bindPopup(imsg);
        gMarker = L.marker(path[0]).addTo(map).bindPopup(imsg);
        line = L.polyline(path, lineprop).addTo(map)  // polyline生成
        info.innerHTML = imsg;        // 情報表示
    } else {                        // 2個目以後のポイント打ちなら
        line.addLatLng(e.latlng);   // polylineにクリック点を追加
        gMarker.setLatLng(e.latlng); // 終点マーカをそこに移動
    }
    if (path.length > 1) {          // 2個以上点が打たれたら計算
        updatedistance(latlngdist(path[path.length - 2], path[path.length - 1]));
    }
    if (e.originalEvent.shiftKey) {  // SHIFT+クリックで
        resetPath(e);                // 終了
    }
}

sisaku.js(tanakai-map.js)

• 既存ピンを最初にクリックをして、キャンセルを押すと新たなピンが刺せなくなった部分を修正。
• キャンセルを押しても、ポップアップの内容が出てしまうため、出ないように修正。

marker.on('click', function (e) {
    e.originalEvent.stopPropagation(); // クリックイベントの伝播を停止

    // 確認ダイアログを表示
    let choice = confirm(`${name} の情報を開きますか？\nOK: 情報を開く\nキャンセル: 距離を測る`);

    if (choice) {
        marker.openPopup(); // OKならポップアップを開く
    } else {
        // ここでポップアップを閉じる
        marker.closePopup();

        // 距離測定を開始する処理
        measurePath({ latlng: marker.getLatLng(), originalEvent: {} });
    }
});

• ポップアップが見切れることがあるため、クリックしたらマップのセンターに移動するよう修正。

marker.on('click', function (e) {
    e.originalEvent.stopPropagation(); // クリックイベントの伝播を停止

    // 確認ダイアログを表示
    let choice = confirm(`${name} の情報を開きますか？\nOK: 情報を開く\nキャンセル: 距離を測る`);

    if (choice) {
        marker.openPopup(); // OKならポップアップを開く
        map.panTo(marker.getLatLng()); // マップのセンターをポップアップ位置に移動
    } else {
        // ここでポップアップを閉じる
        marker.closePopup();

        // 距離測定を開始する処理
        measurePath({ latlng: marker.getLatLng(), originalEvent: {} });
    }
});