[英]d3, data .enter, different groups
我将数据分成数组的dict。 var BTNDATA={'B0':[0],'B1':[1] }
当我按下按钮时,我只想更新那一行圆圈。 (我有5个按钮,5行)
我可以点击添加一个svg圈元素。 我通过将1推送到该dicts数组来更新BTNDATA dict。 BTNDATA[B0].push(1)
这似乎更新了所有键阵列,而不仅仅是那个特定的阵列。
问题是我只想在每次按下按钮时显示相应的圆圈(即行)。 我无法分离cy属性的行元素。
我不明白为什么我不能只是推到数组的字典? 我试图从字典中创建一个数组切片,没有运气。 我尝试创建单独的组,addig追加到这些组而不仅仅是svg容器。
这是d3更新输入退出代码:
function addCrl( bi, crldt) {
var i, btni, crl, shm, drow;
//data
drow = BTNDATA[bi].slice()
crl = svg1.selectAll("circle")
.data(drow)
//update
//enter
crl.enter()
.append("circle")
.attr('class', function(){ return 'c'+btni})
.attr('cx', function() {
return btni + 13
})
.attr('cy', function(){
return drow.length * 2;
} )
.attr("r",13)
.style("fill","red")
//exit
dlt(crl,bi)
crl.exit()
.remove()
}
这是我称之为的循环:
function addBtnClk(bid) {
d3.select('#'+bid).on("click", function() {
BTNDATA[bid].push(1);
var crldt = BTNDATA[bid].slice()
addCrl( bid, crldt );
});
}
function main(){
var i;
//add buttons/eventhandler
for(i=0; i<5; i++){
domBtn( pr[i], ky[i] )
addBtnClk( ky[i] )
}
}
Javascript中没有dicts - 你所谈论的是一个对象。 您正在寻找的语法是BTNDATA.B0.push(1)
或BTNDATA['B0'].push(1)
。 使用当前代码,变量B0
被取消引用以索引到BTNDATA
,这会给您带来不良结果。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.