28 - 非地理的マップ

学習内容: Leafletを使って地図以外のもの（フロアプラン、ゲームマップなど）を表示します。

ポイント:

// 単純な座標系を使用
const map = L.map('map', {
    crs: L.CRS.Simple,  // 緯度経度ではなくピクセル座標
    minZoom: -2,
    maxZoom: 2
});

// 画像の範囲（ピクセル座標）
const bounds = [[0, 0], [1000, 1000]];

// 画像オーバーレイ
L.imageOverlay('floorplan.png', bounds).addTo(map);

// ピクセル座標でマーカーを配置
L.marker([500, 300]).addTo(map).bindPopup('会議室A');

// ビューを画像にフィット
map.fitBounds(bounds);