jQuery/Mapbox multiple data filters issue

Question

У меня есть карта, построенная в Mapbox, которая объединяет GeoJSON. Я пытаюсь фильтровать маркеры по двум критериям: category (несколько true/false properties) и year. Я хочу, чтобы два фильтра работали одновременно, а не отменяли друг друга, но я застреваю при их объединении.

Каждый фильтр работает независимо - это то, что я за год:

$('.year a').on("click", function() { 
    var year = $(this).data('filter'); 
    $(this).addClass('active').siblings().removeClass('active'); 
    featureLayer.setFilter(function(f) { 
     return (year === 'all' || f.properties.Year === year); 
    }); 
    return false; 
}); 

и это то, что у меня есть для категории:

$('.category a').on("click", function() { 
    var category = $(this).data('filter'); 
    $(this).addClass('active').siblings().removeClass('active'); 
    featureLayer.setFilter(function(f) { 
     return ((category === 'all') ? true : f.properties[category] === true); 
    }); 
    return false; 
}); 

Это, как я объединил их, но я знаю, Я делаю что-то не так.

$('.category a, .year a').on("click", function() { 
    var category = $(this).data('filter'); 
    var year = $(this).data('filter'); 
    $(this).addClass('active').siblings().removeClass('active'); 
    featureLayer.setFilter(function(f) { 
     return ((category === 'all') ? true : f.properties[category] === true) && 
     (year === 'all' || f.properties.Year === year); 
    }); 
    return false; 
}); 

Я думаю, что я пропускаю шаг дифференцироваться два фильтр поиска, но я не очень хорошо знаком с JQuery, так что я не уверен, что мне нужно сделать. В частности, я думаю, что мне не хватает части, где категория var ассоциируется с .category a, а year var ассоциируется с .year a.

Любые указатели в правильном направлении были бы очень признательны. Благодаря!

Answer 1

suoz,

Ваша проблема может быть так, как вы ориентируетесь селекторы, чтобы связать событие щелчка. Правильный путь:

$('.category a, .year a').on('click', function() { ... }); 

Вы не сказали об этом, но я думаю, что это может быть проблема или одна из них.

Answer 2

В настоящее время вы устанавливаете year и calendar на то же значение. Попробуйте прямо настроить таргетинг на элементы вместо использования this, чтобы избежать этой проблемы.

$('.category a, .year a').on("click", function() { 

    var category = $('.category a').data('filter'); 
    var year = $('.year a').data('filter'); 

    $(this).addClass('active').siblings().removeClass('active'); 
    featureLayer.setFilter(function(f) { 
     return ((category === 'all') ? true : f.properties[category] === true) && 
     (year === 'all' || f.properties.Year === year); 
    }); 
    return false; 
});