diff --git a/map/Appn/markerlayer.js b/map/Appn/markerlayer.js new file mode 100644 index 0000000..0656dce --- /dev/null +++ b/map/Appn/markerlayer.js @@ -0,0 +1,34 @@ +document.addEventListener("DOMContentLoaded", () => { + // 例: コントロールレイヤ + var mlCenter = [38.891, 139.824]; + var otherPoint = [38.890, 139.822]; + var osmTile = // OSMのタイル + L.tileLayer('//{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', { + attribution: + '© OpenStreetMap \ +contributors' + }); + var gsiTile = // 国土地理院タイル + L.tileLayer('//cyberjapandata.gsi.go.jp/xyz/std/{z}/{x}/{y}.png', { + attribution: + '国土地理院' + }); + var markerLayer1 = L.marker(mlCenter); + var markerLayer2 = L.marker(otherPoint); + var mlmap = L.map("markerlayer", { + layers: [gsiTile, markerLayer1, markerLayer2], + center: mlCenter, zoom: 16, scrollWheelZoom: false + }); + /* 上記4行は以下のようにするのと同じ効果 + var mlmap = L.map("markerlayer").setView(mlCenter, 16); + gsiTile.addTo(mlmap); + markerLayer1.addTo(mlmap); + markerLayer2.addTo(mlmap); */ + // 以下、コントロールレイヤの設定 + // ベースレイヤはOSMと国土地理院2つをJSON形式で指定 + var baseLayers = {'OpenStreetMap': osmTile, '国土地理院': gsiTile}; + // マーカーを2つオーバーレイレイヤに指定 + var ovlLayers = {'マーク1': markerLayer1, 'マーク2': markerLayer2}; + // ベースレイヤとオーバーレイレイヤをマップに追加 + L.control.layers(baseLayers, ovlLayers).addTo(mlmap); +}, false); // HTML文書がロードされたら上のアロー関数を呼ばせる diff --git a/map/Appn/renshu.html b/map/Appn/renshu.html new file mode 100644 index 0000000..1ed6e1c --- /dev/null +++ b/map/Appn/renshu.html @@ -0,0 +1,21 @@ + + + +練習 + + + + + + + +

れんしゅう

+
+ + + +