(() => { function MyMap(id) { var mymap; function init(id) { // 例: コントロールレイヤ var osmTile = // OSMのタイル L.tileLayer('//{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', { attribution: '© <a href="http://osm.org/copyright">OpenStreetMap</a> \ contributors' }); var gsiTile = // 国土地理院タイル L.tileLayer('//cyberjapandata.gsi.go.jp/xyz/std/{z}/{x}/{y}.png', { attribution: '<a href="http://maps.gsi.go.jp/development/ichiran.html">国土地理院</a>' }); var geojsonLayer = L.geoJson(karubi, { // karubi変数は karubi.geojson からロードした style: function (feature) { return feature.properties; }, onEachFeature: function(j, layer) { let p = j.properties; if (p) { let name = p.name, desc = p.description; let popup = "<h3>" + name + "</h3>" + "<p>" + desc + "</p>"; layer.bindPopup(popup); } } }) mymap = L.map("mymap", { layers: [gsiTile], center: [38.9165,139.8297], zoom: 13, scrollWheelZoom: false }); // 以下、コントロールレイヤの設定 // ベースレイヤはOSMと国土地理院2つをJSON形式で指定 var baseLayers = {'OpenStreetMap': osmTile, '国土地理院': gsiTile}; // マーカーを2つオーバーレイレイヤに指定 var ovlLayers = {'カルビーハウス': geojsonLayer}; // ベースレイヤとオーバーレイレイヤをマップに追加 L.control.layers(baseLayers, ovlLayers).addTo(mymap); } // ↓初期化時にすぐ実行される init(id); }; document.addEventListener("DOMContentLoaded", function(){ MyMap("mymap");}, false); })();