「Widget:Custom map」の版間の差分

提供：メタファー リファンタジオ 攻略Wiki
移動先:案内、検索
編集の要約なし
編集の要約なし
 
(同じ利用者による、間の10版が非表示)
1行目: 1行目:
<includeonly>
<includeonly>
<!-- Required CSS -->
<!-- Required CSS -->
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.9.4/dist/leaflet.css"/> 
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/leaflet.draw/1.0.4/leaflet.draw.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/leaflet.draw/1.0.4/leaflet.draw.css"/>
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.9.4/dist/leaflet.css"/> 
<link rel="stylesheet" href="https://dq.h1g.jp/img/dq10_offline/map/css/leaflet-easy-button.css" />
<link rel="stylesheet" href="https://dq.h1g.jp/img/dq10_offline/map/css/leaflet-easy-button.css" />
<link rel="stylesheet" href="https://dq.h1g.jp/img/dq10_offline/map/css/leaflet-tag-filter-button.css" />
<link rel="stylesheet" href="https://dq.h1g.jp/img/dq10_offline/map/css/leaflet-tag-filter-button.css" />
12行目: 12行目:
<script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
<script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
<script src="https://dq.h1g.jp/leaflet/leaflet.js"></script>
<script src="https://dq.h1g.jp/leaflet/leaflet.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/leaflet.draw/1.0.4/leaflet.draw-src.js"></script>
<script src="https://dq.h1g.jp/leaflet/custom-leaflet-draw-locale.js"></script>
<script src="https://dq.h1g.jp/img/dq10_offline/map/js/leaflet-easy-button.js"></script>
<script src="https://dq.h1g.jp/img/dq10_offline/map/js/leaflet-easy-button.js"></script>
<script src="https://dq.h1g.jp/img/dq10_offline/map/js/leaflet-tag-filter-button.js"></script>
<script src="https://dq.h1g.jp/img/dq10_offline/map/js/leaflet-tag-filter-button.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/leaflet.draw/1.0.4/leaflet.draw.js"></script>
<script src="https://dq.h1g.jp/leaflet/custom-leaflet-draw-locale.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.7.2/lightgallery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.7.2/lightgallery.min.js"></script>


<!-- Global Configuration -->
<!-- Global Configuration -->
<script>
<script>
// デバッグログ関数
// Initialize WidgetMap namespace with explicit function placeholder
function debugLog(message, data = null) {
window.WidgetMap = {
     const timestamp = new Date().toISOString();
    map: null,
     const logMessage = data
    drawnItems: null,
        ? `[${timestamp}] ${message}: ${JSON.stringify(data)}`
    drawControl: null,
         : `[${timestamp}] ${message}`;
    editMode: false,
     console.log(logMessage);
    api: {},
    popups: {},
    icons: {},
     // 明示的な関数プレースホルダー
    initializeMap: function() {
        console.error('Map initialization not yet loaded');
        return null;
     }
};
 
// プラグインの読み込み確認機能
function checkPlugins() {
    console.log('Checking Leaflet plugins...');
   
    // Leaflet本体
    console.log('Leaflet version:', L.version);
   
    // Leaflet.Draw
    if (L.Draw) {
         console.log('Leaflet.Draw loaded:', {
            Draw: !!L.Draw,
            DrawToolbar: !!L.DrawToolbar,
            Polyline: !!L.Draw.Polyline
        });
     } else {
        console.error('Leaflet.Draw not loaded properly');
    }
}
}


// GTP8の状態を監視する関数
function checkGTP8State() {
    debugLog('Current GTP8 State', {
        exists: !!window.GTP8,
        properties: window.GTP8 ? Object.keys(window.GTP8) : null,
        initializeMap: window.GTP8 ? typeof window.GTP8.initializeMap : null,
        api: window.GTP8 ? !!window.GTP8.api : null,
        popups: window.GTP8 ? !!window.GTP8.popups : null
    });
}


// スクリプトローダー
 
function loadScript(url) {
 
     return new Promise((resolve, reject) => {
// Initialize API base URL
         debugLog(`Loading script: ${url}`);
(function() {
         const script = document.createElement('script');
     const currentUrl = new URL(window.location.href);
         script.src = url;
    const baseUrl = currentUrl.origin + currentUrl.pathname.split('/').slice(0, -1).join('/');
         script.onload = () => {
    window.API_BASE_URL = baseUrl;
            debugLog(`Successfully loaded: ${url}`);
    console.log('API_BASE_URL initialized:', baseUrl);
            checkGTP8State();
})();
            resolve();
 
         };
// Map configuration
         script.onerror = () => {
window.mapConfig = {
            debugLog(`Failed to load: ${url}`);
    imageUrl: '<!--{$img}-->',
            reject(new Error(`Failed to load ${url}`));
    imageWidth: <!--{$imgwidth}-->,
         };
    imageHeight: <!--{$imgheight}-->,
        document.head.appendChild(script);
    minZoom: <!--{$minzoom}-->,
     });
    maxZoom: <!--{$maxzoom}-->,
    geoJsonPage: '<!--{$geojson}-->',
    iconUrls: {
        icon1: '<!--{$icon1|default:"https://dq.h1g.jp/img/marker-icon-img/marker-icon-blue.png"}-->',
         icon2: '<!--{$icon2|default:"https://dq.h1g.jp/img/marker-icon-img/marker-icon-red.png"}-->',
        icon3: '<!--{$icon3|default:"https://dq.h1g.jp/img/marker-icon-img/marker-icon-violet.png"}-->',
         icon4: '<!--{$icon4|default:"https://dq.h1g.jp/img/marker-icon-img/marker-icon-green.png"}-->',
        icon5: '<!--{$icon5|default:"https://dq.h1g.jp/img/marker-icon-img/marker-icon-gold.png"}-->',
         icon6: '<!--{$icon6|default:"https://dq.h1g.jp/img/marker-icon-img/marker-icon-black.png"}-->',
         icon7: '<!--{$icon7|default:"https://dq.h1g.jp/img/marker-icon-img/marker-icon-orange.png"}-->',
        icon8: '<!--{$icon8|default:"https://dq.h1g.jp/img/marker-icon-img/marker-icon-yellow.png"}-->',
        icon9: '<!--{$icon9|default:"https://dq.h1g.jp/img/marker-icon-img/marker-icon-grey.png"}-->',
        icon10: '<!--{$icon10|default:"https://dq.h1g.jp/img/marker-icon-img/marker-icon-brown.png"}-->'
    },
    filters: {
        filter1: '<!--{$filter1|default:"分類1"}-->',
        filter2: '<!--{$filter2|default:"分類2"}-->',
         filter3: '<!--{$filter3|default:"分類3"}-->',
         filter4: '<!--{$filter4|default:"分類4"}-->',
        filter5: '<!--{$filter5|default:"分類5"}-->',
        filter6: '<!--{$filter6|default:"分類6"}-->',
        filter7: '<!--{$filter7|default:"分類7"}-->',
        filter8: '<!--{$filter8|default:"分類8"}-->',
        filter9: '<!--{$filter9|default:"分類9"}-->',
         filter10: '<!--{$filter10|default:"分類10"}-->'
    }
};
</script>
 
<!-- Load scripts sequentially -->
<script>
// Clear any existing WidgetMap object
if (window.WidgetMap) {
    console.log('[Init] Clearing existing WidgetMap object');
     delete window.WidgetMap;
}
}


// 初期化
// Initialize fresh WidgetMap namespace
window.GTP8 = {
window.WidgetMap = {
    initializeMap: null,
     map: null,
     map: null,
     drawnItems: null,
     drawnItems: null,
71行目: 120行目:
};
};


debugLog('Initial GTP8 setup complete');
function loadScriptsSequentially() {
checkGTP8State();
    function loadScript(src) {
        return new Promise((resolve, reject) => {
            console.log('[Script Loader] Loading:', src);
            const script = document.createElement('script');
            script.src = src;
            script.onload = () => {
                console.log('[Script Loader] Successfully loaded:', src);
                if (src.includes('WidgetMap-core.js')) {
                    // コア読み込み後の検証を強化
                    const verification = {
                        hasWidgetMap: !!window.WidgetMap,
                        initializeMapType: typeof window.WidgetMap.initializeMap,
                        isFunction: typeof window.WidgetMap.initializeMap === 'function'
                    };
                    console.log('[Script Loader] Core verification:', verification);
                   
                    if (!verification.isFunction) {
                        console.error('[Script Loader] initializeMap not properly defined');
                        reject(new Error(`initializeMap not properly defined. Type: ${verification.initializeMapType}`));
                        return;
                    }
                }
                resolve();
            };
            script.onerror = (error) => reject(new Error(`Failed to load ${src}: ${error}`));
            document.head.appendChild(script);
        });
    }


// 順番にスクリプトを読み込む
    // スクリプトの順次読み込み
async function loadAllScripts() {
    return Promise.resolve()
    try {
         .then(() => loadScript('https://dq.h1g.jp/leaflet/widgetmap-core.js'))
         await loadScript('https://dq.h1g.jp/leaflet/gtp8-core.js');
         .then(() => loadScript('https://dq.h1g.jp/leaflet/widgetmap-icons.js'))
         debugLog('After core load', { initializeMap: typeof window.GTP8.initializeMap });
         .then(() => loadScript('https://dq.h1g.jp/leaflet/widgetmap-popups.js'))
       
         .then(() => loadScript('https://dq.h1g.jp/leaflet/widgetmap-api.js'))
        await loadScript('https://dq.h1g.jp/leaflet/gtp8-icons.js');
         .then(() => loadScript('https://dq.h1g.jp/leaflet/widgetmap-init.js'));
         await loadScript('https://dq.h1g.jp/leaflet/gtp8-popups.js');
         await loadScript('https://dq.h1g.jp/leaflet/gtp8-api.js');
          
        // init.jsを読み込む前に最終チェック
        checkGTP8State();
       
        await loadScript('https://dq.h1g.jp/leaflet/gtp8-init.js');
        debugLog('All scripts loaded');
       
        // 最終状態チェック
        checkGTP8State();
    } catch (error) {
        debugLog('Script loading error', error);
        alert('スクリプトの読み込み中にエラーが発生しました。');
    }
}
}


// ページ読み込み完了時に実行
// Start loading when document is ready
$(document).ready(() => {
$(document).ready(() => {
     debugLog('Document ready, starting script load');
     console.log('[Main] Starting initialization');
     loadAllScripts();
    loadScriptsSequentially().catch(error => {
        console.error('[Main] Loading sequence failed:', error);
        alert('モジュールの読み込みに失敗しました。\n詳細はコンソールを確認してください。');
     });
});
});
// エラーハンドリング
window.onerror = function(msg, url, line, col, error) {
    debugLog('Global error caught', {
        message: msg,
        url: url,
        line: line,
        column: col,
        error: error?.toString()
    });
    return false;
};
</script>
</script>
<!-- Map Container -->
<div id="map" style="width: 100%; height: 600px;"></div>
</includeonly>
</includeonly>

2024年11月22日 (金) 02:17時点における最新版

「https://www.h1g.jp/metaphor_refantazio/index.php?title=Widget:Custom_map&oldid=5315」から取得