mapbox,调整多个属性的非独占标记过滤

时间:2014-04-04 16:52:05

标签: javascript filter geojson mapbox

按照此处的非独占标记示例https://www.mapbox.com/mapbox.js/example/v1.0.0/non-exclusive-markers/,一次过滤一个属性非常容易。

我需要编写一些JS,它可以获取一系列要素属性,并显示或隐藏每个标记,具体取决于这些属性是否与给定复选框的值匹配。任何人都可以指出我可以实现这一目标的方法吗?

查看演示http://picturethiswebcenter.com/ods_map/

我的过滤器代码,

//filter locations by category
var filters = document.getElementById('filters');
var cats = document.getElementsByClassName('filter');
var states = document.getElementsByClassName('filter2');

function change() { 
    // Find all checkboxes that are checked and build a list of their values
    var cats_on = [];
    for (var i = 0; i < cats.length; i++) {
        if (cats[i].checked) cats_on.push(cats[i].value);
    }

    var states_on = [];
    for (var i = 0; i < states.length; i++) {
        if (states[i].checked) states_on.push(states[i].value);
    }

    // The filter function takes a GeoJSON feature object
    // and returns true to show it or false to hide it.
    map.markerLayer.setFilter(function (f) {
        // check each property to see if its value is in the list
        // of categories that should be on, stored in the 'on' array
        return cats_on.indexOf(f.properties['category']) !== -1;
        return states_on.indexOf(f.properties['state']) !== -1;
    });

    return false;

}

// When the form is touched, re-filter markers
filters.onchange = change;
// Initially filter the markers
change;

1 个答案:

答案 0 :(得分:0)

一些JavaScript调整:

return cats_on.indexOf(f.properties['category']) !== -1 ||
 states_on.indexOf(f.properties['state']) !== -1;

在JavaScript中,||表示&#39;或&#39;。

change();

要调用某个函数,您需要使用()