獲得獨特元素的列表，從樹形對象

在我小的應用程序，我有一個函數返回樹狀數據：獲得獨特元素的列表，從樹形對象

function getData() { 
return { 
    "name": "fish", 
     "children": [{ 
     "name": "mussels & clams", 
      "children": [{ 
      "name": "fennel", 
       "size": 1 
     }, { 
      "name": "garlic", 
       "size": 1 
     }, { 
      "name": "lemon", 
       "size": 1 
     }, { 
      "name": "onion", 
       "size": 1 
     }, { 
      "name": "parsley", 
       "size": 1 
     }, { 
      "name": "pasta", 
       "size": 1 
     }, { 
      "name": "rice", 
       "size": 1 
     }, { 
      "name": "soup", 
       "size": 1 
     }, { 
      "name": "tomato", 
       "size": 1 
     }] 
    }, { 
     "name": "octopus", 
      "children": [{ 
      "name": "bay", 
       "size": 1 
     }, { 
      "name": "chilli", 
       "size": 1 
     }, { 
      "name": "lemon", 
       "size": 1 
     }, { 
      "name": "olive oil", 
       "size": 1 
     }, { 
      "name": "paprika", 
       "size": 1 
     }, { 
      "name": "parsley", 
       "size": 1 
     }, { 
      "name": "pine nuts", 
       "size": 1 
     }] 
    }, { 
     "name": "oysters", 
      "children": [{ 
      "name": "asparagus", 
       "size": 1 
     }, { 
      "name": "bacon", 
       "size": 1 
     }, { 
      "name": "butter", 
       "size": 1 
     }, { 
      "name": "cellery", 
       "size": 1 
     }, { 
      "name": "chives", 
       "size": 1 
     }, { 
      "name": "garlic", 
       "size": 1 
     }, { 
      "name": "lemon", 
       "size": 1 
     }, { 
      "name": "mozzarella", 
       "size": 1 
     }, { 
      "name": "onion", 
       "size": 1 
     }, { 
      "name": "pasta", 
       "size": 1 
     }, { 
      "name": "parsley", 
       "size": 1 
     }, { 
      "name": "shallot", 
       "size": 1 
     }] 
    }, { 
     "name": "pink fish", 
      "children": [{ 
      "name": "balsamic vinegar", 
       "size": 1 
     }, { 
      "name": "chives", 
       "size": 1 
     }, { 
      "name": "cream", 
       "size": 1 
     }, { 
      "name": "dill", 
       "size": 1 
     }, { 
      "name": "garlic", 
       "size": 1 
     }, { 
      "name": "ham", 
       "size": 1 
     }, { 
      "name": "honey", 
       "size": 1 
     }, { 
      "name": "lemon", 
       "size": 1 
     }, { 
      "name": "lime", 
       "size": 1 
     }, { 
      "name": "mild cheese", 
       "size": 1 
     }, { 
      "name": "miso", 
       "size": 1 
     }, { 
      "name": "potato", 
       "size": 1 
     }, { 
      "name": "sesame", 
       "size": 1 
     }, { 
      "name": "soy souce", 
       "size": 1 
     }, { 
      "name": "spinach", 
       "size": 1 
     }, { 
      "name": "thyme", 
       "size": 1 
     }] 
    }, { 
     "name": "shrimp", 
      "children": [{ 
      "name": "coriander", 
       "size": 1 
     }, { 
      "name": "curry", 
       "size": 1 
     }, { 
      "name": "ginger", 
       "size": 1 
     }, { 
      "name": "lemon", 
       "size": 1 
     }, { 
      "name": "lime", 
       "size": 1 
     }, { 
      "name": "lobster", 
       "size": 1 
     }, { 
      "name": "parsley", 
       "size": 1 
     }, { 
      "name": "soft cheese", 
       "size": 1 
     }, { 
      "name": "tomato", 
       "size": 1 
     }] 
    }, { 
     "name": "smoked fish", 
      "children": [{ 
      "name": "asparagus", 
       "size": 1 
     }, { 
      "name": "butter", 
       "size": 1 
     }, { 
      "name": "eggs", 
       "size": 1 
     }, { 
      "name": "lemon", 
       "size": 1 
     }, { 
      "name": "mandarin", 
       "size": 1 
     }, { 
      "name": "mild cheese", 
       "size": 1 
     }, { 
      "name": "mushrooms", 
       "size": 1 
     }, { 
      "name": "onion", 
       "size": 1 
     }, { 
      "name": "potato", 
       "size": 1 
     }, { 
      "name": "spring onion", 
       "size": 1 
     }] 
    }, { 
     "name": "squid", 
      "children": [{ 
      "name": "bacon", 
       "size": 1 
     }, { 
      "name": "courgette", 
       "size": 1 
     }, { 
      "name": "cumin", 
       "size": 1 
     }, { 
      "name": "garlic", 
       "size": 1 
     }, { 
      "name": "lemon", 
       "size": 1 
     }, { 
      "name": "lime", 
       "size": 1 
     }, { 
      "name": "onion", 
       "size": 1 
     }, { 
      "name": "parsley", 
       "size": 1 
     }, { 
      "name": "peper", 
       "size": 1 
     }, { 
      "name": "rocket", 
       "size": 1 
     }, { 
      "name": "thyme", 
       "size": 1 
     }] 
    }, { 
     "name": "sushi", 
      "children": [{ 
      "name": "coriander", 
       "size": 1 
     }, { 
      "name": "couscous", 
       "size": 1 
     }, { 
      "name": "cucumber", 
       "size": 1 
     }, { 
      "name": "ginger", 
       "size": 1 
     }, { 
      "name": "lemon", 
       "size": 1 
     }, { 
      "name": "lime", 
       "size": 1 
     }, { 
      "name": "pepper", 
       "size": 1 
     }, { 
      "name": "rice", 
       "size": 1 
     }, { 
      "name": "sesame", 
       "size": 1 
     }, { 
      "name": "soya souce", 
       "size": 1 
     }, { 
      "name": "spring onion", 
       "size": 1 
     }, { 
      "name": "wasabi", 
       "size": 1 
     }] 
    }, { 
     "name": "white fish", 
      "children": [{ 
      "name": "butter", 
       "size": 1 
     }, { 
      "name": "courgette", 
       "size": 1 
     }, { 
      "name": "gream", 
       "size": 1 
     }, { 
      "name": "fennel", 
       "size": 1 
     }, { 
      "name": "french beans", 
       "size": 1 
     }, { 
      "name": "garlic", 
       "size": 1 
     }, { 
      "name": "leak", 
       "size": 1 
     }, { 
      "name": "lemon", 
       "size": 1 
     }, { 
      "name": "lime", 
       "size": 1 
     }, { 
      "name": "mild cheese", 
       "size": 1 
     }, { 
      "name": "onion", 
       "size": 1 
     }, { 
      "name": "parsley", 
       "size": 1 
     }, { 
      "name": "soup", 
       "size": 1 
     }, { 
      "name": "soya souce", 
       "size": 1 
     }, { 
      "name": "tomato", 
       "size": 1 
     }] 
    }, { 
     "name": "caviar", 
      "children": [{ 
      "name": "chives", 
       "size": 1 
     }, { 
      "name": "eggs", 
       "size": 1 
     }, { 
      "name": "sour cream", 
       "size": 1 
     }, { 
      "name": "strong cheese", 
       "size": 1 
     }] 
    }, { 
     "name": "lobster & crab", 
      "children": [{ 
      "name": "chili", 
       "size": 1 
     }, { 
      "name": "coriander", 
       "size": 1 
     }, { 
      "name": "fennel", 
       "size": 1 
     }, { 
      "name": "ginger", 
       "size": 1 
     }, { 
      "name": "leek", 
       "size": 1 
     }, { 
      "name": "mayonnaise", 
       "size": 1 
     }, { 
      "name": "parsley", 
       "size": 1 
     }, { 
      "name": "pasta", 
       "size": 1 
     }, { 
      "name": "peas", 
       "size": 1 
     }, { 
      "name": "rice", 
       "size": 1 
     }, { 
      "name": "sesame", 
       "size": 1 
     }, { 
      "name": "soy sauce", 
       "size": 1 
     }, { 
      "name": "wasabi", 
       "size": 1 
     }] 
    }] 
};}

的數據可視化這樣的：

enter image description here

這裏是jsfiddle。

我想在主圖表的右側創建一個標籤列表，其中包含在樹葉中找到的所有值，但每個值只有一次。換句話說，它應該包含：

「蘆筍」
「臘肉」
「香醋」
等

（就像所有的「聯盟」葉）

如何獲得具有獨特元素的數組？

（顯示的標籤是沒有問題的，我曾經我有一個陣列）

乾杯！

來源

2014-01-24 VividD

所以，你可以非常容易地使用如IxJS，lodash或underscore這樣的庫。

但是，這裏有一種方法可以在沒有外部依賴的情況下完成。

function flatMap (arr, selector) { 
    return Array.prototype.concat.apply([], arr.map(selector)); 
} 

var names = 
    flatMap(getData().children, function (x) { return x.children; }) 
    .map(function (x) { return x.name; }); 

var length = names.length; 
var namesAndCount = {}; 

for (var i = 0; i < length; i++) { 
    var name = names[i]; 
    namesAndCount[name] = namesAndCount[name] ? namesAndCount[name] + 1 : 1; 
}

在這一點上，namesAndCount將類似於此：

{ 
    "fennel":3, 
    "garlic":5, 
    "lemon":9, 
    "onion":5, 
    ... 
}

來源

2014-01-24 19:21:30

這真的很酷（櫃檯）！謝謝！ – VividD

很容易檢索所有名稱屬性/屬性。

var fishNames = nodes.map(function(x){return x.name});

要在javascript中獲取數組的唯一值，請檢查here。

來源

2014-01-24 18:35:42

不，這不遍歷子節點。你必須走整個樹。 – greim

節點是他在腳本中使用的變量： 'var root = getData（）， nodes = radialCluster.nodes（root），...' 你明白我的意思了嗎？ –

假設'radialCluster.nodes（root）'返回一個扁平列表，那麼是的。 – greim

var data = getData(); 
var namesObj = {}; // Put leaves into object first for uniqueness 
for(var c0 in data.children) 
    for(var c1 in data.children[c0].children) 
    namesObj[data.children[c0].children[c1].name] = 1; 

var names = []; // Then put unique leaves into an array 
for(var name in namesObj) names.push(name); 

names // ["fennel", "garlic", "lemon", "onion", "parsley", "pasta", "rice", "soup", "tomato", "bay", "chilli", "olive oil", "paprika", "pine nuts", "asparagus", "bacon", "butter", "cellery", "chives", "mozzarella", "shallot", "balsamic vinegar", "cream", "dill", "ham", "honey", "lime", "mild cheese", "miso", "potato", "sesame", "soy souce", "spinach", "thyme", "coriander", "curry", "ginger", "lobster", "soft cheese", "eggs", "mandarin", "mushrooms", "spring onion", "courgette", "cumin", "peper", "rocket", "couscous", "cucumber", "pepper", "soya souce", "wasabi", "gream", "french beans", "leak", "sour cream", "strong cheese", "chili", "leek", "mayonnaise", "peas", "soy sauce"]

來源

2014-01-24 18:40:21 Matt

你需要對你的對象做一個標準的樹遍歷。例如，假設你有一個在每個節點高層的回調函數：

walkObject(obj, function(obj, name, parent){ 
    /* obj === parent[name] */ 
});

所以我會做：

var names = {}; 
walkObject(nodes, function(obj, name, parent){ 
    if (name !== 'name') return; 
    names[obj] = true; 
}); 
var uniqueList = Object.keys(names);

希望有所幫助。

來源

2014-01-24 18:44:44 greim

獲得獨特元素的列表，從樹形對象

回答

相關問題