@VitStar

Как реализовать такой фильтр?

Добрый вечер! Делаю фильтр меток для yandex map. Есть несколько тегов по которым хотелось бы фильтровать. То есть есть теги (Птицы и грызуны, Аквариумистика, Ветаптека, Рыбы, Рептилии, Грумминг) На каждой метке может быть несколько тегов. По умолчанию они checked и выводятся все метки на карте.
За основу беру пример из док https://tech.yandex.ru/maps/jsbox/2.1/geoobjects_menu
Но почему то у меня он не работает так как нужно.
Сам js код
ymaps.ready(init);

    function init() {
      var myMap = new ymaps.Map('magazine_map', {
        center: [55.76, 37.64],
        zoom: 10
      },{
        searchControlProvider: 'yandex#search'
      });
      
      // Фильтр по тегам
      function checkState() {
        var shownObjects,
          byTag = new ymaps.GeoQueryResult();

          // var typeEnterprises = [];

          //  $('.magazine-filter__tag').each(function (index, el) {
          //     if ($(this).is(':checked')) {
          //         typeEnterprises.push($(this).val());
          //     }
          // });

          // // myMap.geoObjects.removeAll();

          // $.each(typeEnterprises,function(keyTag, valueTag){
          //   ymaps.geoQuery(valueTag).addToMap(myMap);
          // })

          if ($('#filter__cat1').prop('checked')) {
            // Будем искать по двум параметрам:
            // - для точечных объектов по полю preset;
            // - для контурных объектов по цвету заливки.
            byTag = objectManager.search('tag = "Птицы и грызуны"');
        }

        // Мы отобрали объекты по цвету и по форме. Покажем на карте объекты,
        // которые совмещают нужные признаки.
        shownObjects = byTag.addToMap(myMap);
        // Объекты, которые не попали в выборку, нужно убрать с карты.
        objectManager.remove(shownObjects).removeOverlay(myMap);
      }

      $('#filter__cat1').click(checkState);



      $.ajax({
        url: "data.json"
      }).done(function (data) {
        window.objectManager  = ymaps.geoQuery(data).addToMap(myMap);
      });

    }

Json находится в отдельном файлике. Он вида
f449COO.png
При клике на соответствующий чекбок должны на карте
<div class="form-check">
            <input type="checkbox" class="magazine-filter__tag" id="filter__cat1" value="Птицы и грызуны" checked>
            <label for="filter__cat1">Птицы и грызуны</label>
          </div>

Убираться метки. Но выдает ошибку https://i.imgur.com/rpqTMR9.png
Может кто делал подобное. В yandex map не силен поэтому может тут и банальная ошибка.
Заранее спасибо за помощь.
  • Вопрос задан
  • 511 просмотров
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы