score:1

Accepted answer

The reason why no matches remain when you check both is that you generate filters that contain contradictory conditions. For instance, it would generate 3 selectors like this:

[data-staralt~='4.5'][data-staralt~='category']
[data-cat~='4'][data-cat~='Ramen']
[data-star~='4'][data-star~='Ramen']

Each one is saying that the attribute should contain both words at the same time. This is not what you were after. Instead, I think you want to perform this logic (in pseudo language):

([data-staralt~='4.5'] or [data-cat~='4'] or [data-star~='4']) AND
([data-staralt~='category'] or [data-cat~='Ramen'] or [data-star~='Ramen'])

This you can achieve with the following code. Side note: don't use the deprecated delegate jQuery method, but the on method (which has its first two parameters reversed):

$(document).on('change', 'input[type=checkbox]', function() {
    var $list = $('.leaflet-zoom-animated > g > circle'),
        $checked = $('input:checked');  
    if ($checked.length) {                          
        $list.hide();
        $($checked).each(function(index, element){
            // Reduce list to what matches one of the three filters.
            // The comma in the selector works as a logical OR:
            $list = $list.filter("[data-staralt~='" + element.name + "'],[data-cat~='" + element.value + "'],[data-star~='" + element.value + "']");
        });
    }
    // Show what remains in list:
    $list.show();
});

Appendix

After our conversion, I have the impression you need the following logic:

([data-staralt~='4.5'] or [data-staralt~='3.5']) and 
([data-cat~='4'] or [data-cat~='3']) and 
([data-star~='4'] and [data-star~='3])

I also came to understand the reason for staralt, i.e. to include 3.5 also when 3 is selected. But this you can do with the ^= comparison. So I would do that instead of the extra name attribute check.

So that leads to the following code:

function createFilter(type) { // Helper function
    var filter = [];
    $("#" + type + '-filter input:checked').each(function(index, element) {
        filter.push("[data-" + type + "^='" + element.value + "']"); // Use ^= to match the start of the actual value
    });
    return filter.join(",") || "*"; // Asterisk means: no filter at all
}

$(document).on('change', 'input[type=checkbox]', function() {
    $('.leaflet-zoom-animated > g > circle')
        .hide()
        .filter(createFilter("star")) // Any of the checked star selections, AND
        .filter(createFilter("review")) // Any of the review selections, AND
        .filter(createFilter("cat")) // Any of the cat selections
        .show(); // Show the matches of the above filter
});

Related Query