Question

我使用D3但不使用JQuery。

我参加世界杯的国家有一系列机场：

d3.csv("output4.csv",
    function(data) {return {airports: d.Airports, country: data.Country, cup: data.WorldCupGroup }},
    function(data) {
    var new_array = data.map(function (d) {return [d.country, d.cup, d.timezone]}); 
    // D3 attributes added here
    });

我的用户将点击下拉菜单并选择＆＃34; World Cup Group＆＃34; A到H，我希望d.country中的数据只过滤到那些组，然后只渲染那些组＆＃39;机场在我的仪表板中。

我存储了用户在

中选择的内容

var cupsArray = [];
var cupChecks = document.querySelectorAll('input[type=checkbox]:checked.CupGroup')
for (var i = 0; i < cupChecks.length; i++) {
    cupsArray.push(cupChecks[i].value);
}

直接在上面，这样我就不必使用任何全局变量（D3.csv函数嵌套在更新函数中）。

如果用户只选中了一个复选框，我只需要执行

new_array.filter(function(d) { return d[0] == cupsArray})

但如果他们选择多个，代码就会失败。

如果用户选择了两个，那么我可以这样做：

var new_array = new_array.filter( function(d) {return d[0] == cupsArray[0] || d[0] == cupsArray[1]})

但显然对世界杯组的所有8个可能的复选框都这样做是犯罪行为。

我尝试过像

这样的事情

var new_array = new_array.filter( function(d, i) {return d[5] == cocomArray[i] })

但是没有给它一个＆＃34;或＆＃34;那里的逻辑，所以它返回每一行。我怎样才能返回＆＃34; x号＆＃34;我的数据中的过滤器？

数据样本：

Airport_name    Country WorldCupGroup
Arrabury Airport    Australia   C
El Arish International Airport  Egypt   A
Arapoti Airport Brazil  E
Merzbrück Airport   Germany F
Arraias Airport Brazil  E
Aalborg Airport Denmark C
Anapa Airport   Russia  A
Aarhus Airport  Denmark C
Araxá Airport   Brazil  E

Answer 1

如果我理解正确，我认为您应该可以使用.indexOf。也许就像这样：

var new_array = new_array.filter(function(d, i) { return cupsArray.indexOf( d[0] ) >= 0; })

如果在数组中找不到值（在本例中为d [0]），则.indexOf将返回-1（在本例中为cupsArray）。

用另一个数组

1 个答案: