(() => { 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>' }); //manoma------------------- var geojsonLayer = L.geoJson(manoma, { // manoma変数は manoma.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); } } }) //ひよりべーかりー----------------- var geojsonLayer = L.geoJson(hiyori, { // manoma変数は manoma.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); } } }) //Cafe First Penguin-------------------- var geojsonLayer = L.geoJson(penguin, { // manoma変数は manoma.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 }); geojsonLayer.addTo(mymap); //manoma-------------- var manomaTenpo = L.polygon(manoma).addTo(mymap); manomaTenpo.bindPopup("manomaだよ"); geojsonLayer.bindPopup("公益大からmanomaまでの道のりなのです") //ひよりべーかりー--------------- var hiyoriTenpo = L.polygon(hiyori).addTo(mymap); hiyoriTenpo.bindPopup("ヒヨリベーカリー&カフェだよ"); geojson2Layer.bindPopup("公益大からヒヨリベーカリー&カフェまでの道のりなのです") //Cafe Fast Penguin---------------------- var penguinTenpo = L.polygon(penguin).addTo(mymap); penguinTenpo.bindPopup("Cafe First Penguinだよ"); geojson3Layer.bindPopup("公益大からCafe First Penguinまでの道のりなのです") // 以下、コントロールレイヤの設定 // ベースレイヤはOSMと国土地理院2つをJSON形式で指定 var baseLayers = {'OpenStreetMap': osmTile, '国土地理院': gsiTile}; // マーカーを2つオーバーレイレイヤに指定 var ovlLayers = {'manoma': geojsonLayer}; var ovlLayers = {'manoma': geojson2Layer}; var ovlLayers = {'manoma': geojson3Layer}; // ベースレイヤとオーバーレイレイヤをマップに追加 L.control.layers(baseLayers, ovlLayers).addTo(mymap); } // ↓初期化時にすぐ実行される init(id); }; document.addEventListener("DOMContentLoaded", function(){ MyMap("mymap");}, false); })();