function myInit() { var gsi = L.tileLayer('//cyberjapandata.gsi.go.jp/xyz/std/{z}/{x}/{y}.png', { attribution: '© <a href="https://maps.gsi.go.jp">国土地理院地図</a> contributors' }); var osm = L.tileLayer('//{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', { attribution: '© <a href="http://osm.org/copyright">OpenStreetMap</a> contributors' }); var Bing = new L.BingLayer("AvRR1iCvcIBp2R9fSTjK7FSHYDT0zpGCWT9PoyO7gHt9nEFBOcROZuuTnXjhWOig", {type: "Road", culture: "ja"}); var BingAir = new L.BingLayer("AvRR1iCvcIBp2R9fSTjK7FSHYDT0zpGCWT9PoyO7gHt9nEFBOcROZuuTnXjhWOig", {type: "Aerial", culture: "ja"}); var WithLabels = new L.BingLayer("AvRR1iCvcIBp2R9fSTjK7FSHYDT0zpGCWT9PoyO7gHt9nEFBOcROZuuTnXjhWOig", {type: "AerialWithLabels", culture: "ja"}); var LabelsOnDe = new L.BingLayer("AvRR1iCvcIBp2R9fSTjK7FSHYDT0zpGCWT9PoyO7gHt9nEFBOcROZuuTnXjhWOig", {type: "AerialWithLabelsOnDemand", culture: "ja"}); var map = L.map('mapset', {zoomControl: false }); gsi.addTo(map); map.setView([38.8675, 139.8190], 12); var baseMaps = { "地理院地図" : gsi, "オープンストリートマップ" : osm, "BingMap" : Bing, "BingMap衛星写真" : BingAir, "BingMap地名あり" : WithLabels, "BingMap地名+" : LabelsOnDe }; var preserve = L.geoJSON(areawild, { color: 'green', weight: 3, fill: true, fillcolor: '#32cd32', opacity: 0.5 }); var vcon = L.icon({ iconUrl: '../material/vcon.png', iconSize: [28,31], iconAnchor: [14,31], }) var vrmarker = L.geoJSON(vrpoint, { pointToLayer: function (feature, latlng) { return L.marker(latlng, { icon: vcon }); }, onEachFeature: function(feature, layer) { if(feature.properties && feature.properties.popupContent){ layer.bindPopup(feature.properties.popupContent); } } }).addTo(map); preserve.addTo(map); vrmarker.addTo(map); var overlay = { "WildlifePreserveArea": preserve, "VirtualRealityPoint": vrmarker }; var layctrl = L.control.layers(baseMaps, overlay).addTo(map); L.control.zoom({ position: 'topleft' }).addTo(map); L.control.scale({ position: 'bottomright' }).addTo(map); map.on('mousemove', onMapMousemove) var laloinfo = L.control({ position: "bottomleft" }); laloinfo.onAdd = function (map) { this.ele = L.DomUtil.create('div', "infostyle"); this.ele.id = "latlondiv"; this.ele.style.visibility = "hidden"; this.ele.onmousemove = function (e) { e.stopPropagation() }; return this.ele; }; laloinfo.addTo(map); var lg = L.featureGroup(); lg.addTo(map); let urlbase = "https://www.yatex.org/gitbucket/SKIP/bird-2021/raw/master/geo-material" function addPoly(pat) { var reg = new RegExp(pat); console.log("SEARCH: "+pat); for (let l of lg.getLayers()) lg.removeLayer(l); layctrl.removeLayer(lg, pat); layctrl.addOverlay(lg, pat); lg.name = 'habitat'; var areafiles = ["mori", "kawa", "city", "park", "yoshi", "tanbo", "hatake", "kaigan", "minato"]; for (let m of areafiles) { fetch(urlbase + "/" + m + ".geojson").then((resp) => { //Bpart console.log("Loading "+m+", "+resp.ok); if (resp.ok) return resp.text(); throw new Error(); }).then((txt) => { if (!txt) return; let j = JSON.parse(txt); let name = j.features[0].properties.name; if (name && name.match(reg)) lg.addLayer(L.geoJSON(j, { style: function (feature) { return { color: feature.properties['color'], weight: feature.properties['weight'], opacity: feature.properties['opacity'], fillColor: feature.properties['fillColor'], fillOpacity: feature.properties['fillOpacity'] } }, onEachFeature: function onEachFeature( feature,layer ){ console.log('attention!!') if(feature.properties && feature.properties.popupContent){ layer.bindPopup(feature.properties.popupContent); } } }).addTo(map)); }) } } document.getElementById("seeker").addEventListener("click",(e)=>{ addPoly(document.getElementById("keyword").value); }); } function onMapMousemove(e) { var box = document.getElementById("latlondiv"); var llnum = "緯度:" + e.latlng.lat.toFixed(6) + "<br>" + "経度:" + e.latlng.lng.toFixed(6); box.innerHTML = llnum; box.style.visibility = "visible"; }; document.addEventListener("DOMContentLoaded", myInit, false);