根據一個屬性過濾JavaScript對象

我的json文件是這樣的。根據一個屬性過濾JavaScript對象

[ 
    { 
    "ArtistID": 1, 
    "FollowerID": 1, 
    "Name": "JAYAH-Paradiso", 
    "Location": "UK", 
    "Latitude": "51.5", 
    "Longitude": "0.1167", 
    "Date": "22/03/2014" 
    }, 
    { 
    "ArtistID": 1, 
    "FollowerID": 2, 
    "Name": "Yasmin Dan", 
    "Location": "London", 
    "Latitude": "51.5072", 
    "Longitude": "0.1275", 
    "Date": "22/03/2014" 
    }, 
    { 
    "ArtistID": 2, 
    "FollowerID": 1, 
    "Name": "Daniel Sutka", 
    "Location": "London", 
    "Latitude": "51.5072", 
    "Longitude": "0.1275", 
    "Date": "22/03/2014" 
    }, 
    { 
    "ArtistID": 2, 
    "FollowerID": 2, 
    "Name": "Colton Brown", 
    "Location": "Moore Haven, Florida", 
    "Latitude": "26.8333", 
    "Longitude": "81.1", 
    "Date": "22/03/2014" 
    } 
]

我想在地圖中顯示藝術家1和藝術家2的追隨者。我想分別顯示這些數據，例如藝術家1的追隨者在RED圈子中的位置和藝術家2的追隨者的位置在藍色圓圈中。

而藝術家1和藝術家2有2個按鈕。當我點擊藝術家1按鈕時，它應該只顯示紅色圓圈。

有人可以告訴我一種方法來使用ArtistID對這些數據進行分組，以便我可以在這些按鈕點擊中使用它嗎？

我有地圖像10個紅色圓圈（Artist1），10個藍色圓圈（Artist2），10個綠色圓圈（Artist3）對這些套圈。我如何選擇僅使用d3 selectAll的紅色圓圈或選擇？

或者還有其他方法嗎？

顏色已經給出了這樣的（爲「補」在「樣式」屬性的值，

feature = g.selectAll("circle") 
        .data(data) 
        .enter().append("circle") 
        .attr("id", function (d) { return d.ArtistID + d.FollowerID; }) 
        .style("stroke", "black") 
        .style("opacity", .6) 
        .style("fill", function (d) { 
         if (d.ArtistID == 1) { return "red" } 
         else if (d.ArtistID == 2) { return "blue" } 
         else { return "green" } 
         ; 
        }) 
        .attr("r", 10);

所以，圓圈將繪製這樣，

<circle id="10" r="10" transform="translate(695,236)" style="stroke: rgb(0, 0, 0); opacity: 0.6; fill: rgb(255, 255, 0);"></circle>

我想要選擇紅色的圓圈

要麼過濾json文件的數據，要麼只選擇一種顏色的圓圈將會有所幫助

在此先感謝。

來源

2014-09-04 Isu

你有沒有看在過濾器？ https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/filter。只需檢查'ArtistID'的元素，並調用任何不同的東西。 – kingdamian42 2014-09-04 18:24:33

它不適用於其他D3方法：/ – Isu 2014-09-04 18:29:45

檢出[''d3.nest（）']（https://github.com/mbostock/d3/wiki/Arrays#d3_nest）和[本答案]（http：/ /stackoverflow.com/questions/25642422/array-manipulation-with-d3-nest-and-rollup/25651121#25651121）。 – meetamit 2014-09-04 18:34:07

您可能需要考慮爲此使用下劃線。（特別是如果你正在做更多這樣的操作。）where函數描述了你正在尋找的東西。

_.where(array, {ArtistID: X});

http://underscorejs.org

編輯：GROUPBY方法也可能是在這種情況下使用你的。

來源

2014-09-04 18:35:03 tengbretson

您可以使用下面的代碼來過濾數據，並得到了藝術家2的追隨者的數組：

<html> 
<head>  
<script src="http://code.jquery.com/jquery-1.11.1.js"></script> 
<script> 
$(function() { 
     var json = '[{"ArtistID":1,"FollowerID":1,"Name":"JAYAH-Paradiso","Location":"UK","Latitude":"51.5","Longitude":"0.1167","Date":"22/03/2014"},{"ArtistID":1,"FollowerID":2,"Name":"Yasmin Dan","Location":"London","Latitude":"51.5072","Longitude":"0.1275","Date":"22/03/2014"},{"ArtistID":1,"FollowerID":3,"Name":"Aaron Senior","Location":"London,UK","Latitude":"51.5072","Longitude":"0.1275","Date":"22/03/2014"},{"ArtistID":2,"FollowerID":1,"Name":"Daniel Sutka","Location":"London","Latitude":"51.5072","Longitude":"0.1275","Date":"22/03/2014"},{"ArtistID":2,"FollowerID":2,"Name":"Colton Brown","Location":"Moore Haven, Florida","Latitude":"26.8333","Longitude":"81.1","Date":"22/03/2014"},{"ArtistID":2,"FollowerID":3,"Name":"Thia Kirby","Location":"England","Latitude":"51.5","Longitude":"0.1167","Date":"22/03/2014"}]'; 

     var obj = jQuery.parseJSON(json); 

     console.log(obj); 

     var newArray = obj.filter(function (el) { return el.ArtistID == 2 }); 

     console.log(newArray); 
}); 
</script> 
</head> 
<body> 

</body> 
</html>

來源

2014-09-04 18:43:16

它在瀏覽器控制檯中發出錯誤，提示「json未定義」o.O – Isu 2014-09-04 18:55:50

我編輯了代碼，請重試 – 2014-09-04 19:04:37

嘗試使用它來獲取所需的字段：

<script> 
var json = [ 
{ 
    "ArtistID": 1, 
    "FollowerID": 1, 
    "Name": "JAYAH-Paradiso", 
    "Location": "UK", 
    "Latitude": "51.5", 
    "Longitude": "0.1167", 
    "Date": "22/03/2014" 
}, 
{ 
    "ArtistID": 1, 
    "FollowerID": 2, 
    "Name": "Yasmin Dan", 
    "Location": "London", 
    "Latitude": "51.5072", 
    "Longitude": "0.1275", 
    "Date": "22/03/2014" 
}, 
{ 
    "ArtistID": 2, 
    "FollowerID": 1, 
    "Name": "Daniel Sutka", 
    "Location": "London", 
    "Latitude": "51.5072", 
    "Longitude": "0.1275", 
    "Date": "22/03/2014" 
}, 
{ 
    "ArtistID": 2, 
    "FollowerID": 2, 
    "Name": "Colton Brown", 
    "Location": "Moore Haven, Florida", 
    "Latitude": "26.8333", 
    "Longitude": "81.1", 
    "Date": "22/03/2014" 
} 
]; 
var data = eval(json); 
for(x in data){ 
    alert(data[x].ArtistID); 
if(){//check condition on ArtistID and use the data 
} 
} 
</script>

來源

2014-09-04 18:55:24

根據一個屬性過濾JavaScript對象

回答

相關問題