function myInit() {
  var gsi = L.tileLayer('//cyberjapandata.gsi.go.jp/xyz/std/{z}/{x}/{y}.png', {
    attribution: '&copy; <a href="https://maps.gsi.go.jp">国土地理院地図</a> contributors'
    });
  var osm = L.tileLayer('//{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
     attribution: '&copy; <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
            ){
              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);