d3：データを手動で要素にリンクする方法

Question

私は5つの既存のdiv要素と配列dataの5つの値を持っています。 現在d（d3）eachはundefinedを返しますが、data[i]を返します。 dはD3 enter()を使用せずにdata[i]の値を返すようにdivとdata[i]を関連付ける方法

d3.selectAll("div")     
       .each(function(d,i){         
        console.log(d, i, data[i]); 
} 

？

Answer 1

解決策は、hereです。各divにidを追加し、dataにidとkeyを使用して結合を使用します。

data = [ 
      {"key":"0","val":"10"}, 
      {"key":"1","val":"5"}, 
      {"key":"2","val":"8"} 
     ];  
... 
d3.selectAll("div.h-bar") 
       .data(data, function(d:any){ 
        var x = d? d.key : this.id; 
        return x; 
       })     
       .each(function(d:any,i:any){   
        console.log(d, i, data[i]); 
} 

Answer 2

私たちは、各要素のモデルにnewvalueを割り当てるためにdatum(newvalue)を使用することができます。

data        
       .forEach(function(d:any){   
        var item = d3.select('#div'+d.key).datum(d); 
       });