Question

我有5个现有的div元素和一个包含5个值的数组data。目前d3 d中的each会返回undefined，而data[i]会返回该值。

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

如何关联div和data[i]，以便d在不使用d data[i]的情况下返回enter()的值？

Answer 1

解决方案是here。将id添加到每个div，然后通过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

我们可以使用datum(newvalue)将newvalue分配给每个元素的模型。

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

d3：如何手动将数据链接到元素

2 个答案: