從基準中使用d3.selection.classed（）和類的值

我將一些項目的樣式從JS移動到CSS，因此我有更好的關注點分離。從基準中使用d3.selection.classed（）和類的值

現在我想通過提供像

var keyItems = [ 
    {'forClass': 'tree', 'text':'Tree which has been maped'}, 
    {'forClass': 'pond', 'text':'Pond, not a puddle!'}, 
    {'forClass': 'contaminatedLand', 'text':'Do not go here'}, 
];

然而，隨着d3.selection.classed()數組創建我的鑰匙需要一個字符串，而不是一個功能，我不能做

.classed(function(d){return d.forclass;}

但是一個可以做像

keyItems.forEach(function(datum, index){ 
    keyEnter.selectAll('rect').classed(datum.forClass,function(d){ 
     return d.forClass == datum.forClass; 
    }) 
})

但是，這感覺就像是打破D3和雜亂的精神。

隨意看看我的JSFiddle

問題

有沒有想辦法做到這一點，我可能忽略了一個更清潔D3？

編輯1

取得的進展一點點在這個JSFiddle但任何進一步的改進表示歡迎。

.each(function(d){ 
     d3.select(this).classed(d.forClass, true) 
})

來源

2014-02-19 Christopher Hackett

'.attr（ '類'，函數（d）{返回d.forClass;}）;' – FernOfTheAndes

keyEnter 
    .append('rect') 
    .attr('height', 5) 
    .attr('width', 5) 
    .attr('x', 20) 
    .attr('y', function(d, i){return (i+0.25) * 30;}) 
    .attr('class',function(d){return d.forClass;});

做相同的文字...

來源

2014-02-19 14:45:15 FernOfTheAndes

知道我失去了一些東西明顯。（我有一種感覺，當你做類似'.attr（'class'，'a'）。attr（'class'，'b'）'的類時，類不會表現得很好，但我剛剛檢查過並且工作正常現在） –

@ChristopherHackett對於這種情況，它的效果很好，而'.classed ...'方法對於切換很有效。 – FernOfTheAndes

凸輪有人說我爲什麼datum是在功能？數據的含義是什麼？ –

從基準中使用d3.selection.classed（）和類的值

回答

相關問題