var mymap = L.map("mymap").setView([38.911, 139.835], 14);

L.tileLayer('//{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
  attribution: '&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'
}).addTo(mymap);

// 公園データ（座標・名前・遊具・画像）
var parks = [
  {
    name: "庄内緑地公園",
    lat: 38.9125,
    lng: 139.8341,
    yuugu: ["すべり台", "ブランコ"],
    image: "shonai_park.jpg"
  },
  {
    name: "日和山公園",
    lat: 38.9182,
    lng: 139.8320,
    yuugu: ["シーソー", "ブランコ"],
    image: "hiyoriyama_park.jpg"
  },
  {
    name: "中央公園",
    lat: 38.9053,
    lng: 139.8275,
    yuugu: ["すべり台"],
    image: "chuou_park.jpg"
  }
];

var markers = [];

// マーカー追加関数
function addMarkers() {
  for (var i = 0; i < parks.length; i++) {
    var park = parks[i];
    var marker = L.marker([park.lat, park.lng]);
    marker.yuugu = park.yuugu; // 遊具属性を保存

    var popupContent =
      "<strong>" + park.name + "</strong><br>" +
      "遊具: " + park.yuugu.join(", ") + "<br>" +
      "<img src='" + park.image + "' alt='" + park.name + "' width='200' />";

    marker.bindPopup(popupContent);
    marker.addTo(mymap);
    markers.push(marker);
  }
}

// 初期マーカー描画
addMarkers();

// フィルター処理
function updateMarkers() {
  var checkboxes = document.querySelectorAll('#controls input[type=checkbox]');
  var checkedValues = [];
  for (var i = 0; i < checkboxes.length; i++) {
    if (checkboxes[i].checked) {
      checkedValues.push(checkboxes[i].value);
    }
  }

  for (var i = 0; i < markers.length; i++) {
    var marker = markers[i];
    var show = false;
    for (var j = 0; j < marker.yuugu.length; j++) {
      if (checkedValues.includes(marker.yuugu[j])) {
        show = true;
        break;
      }
    }
    if (show) {
      marker.addTo(mymap);
    } else {
      mymap.removeLayer(marker);
    }
  }
}

// チェックボックス変更イベント
var checkboxes = document.querySelectorAll('#controls input[type=checkbox]');
for (var i = 0; i < checkboxes.length; i++) {
  checkboxes[i].addEventListener('change', updateMarkers);
}