d3,数据.enter,不同的组

时间:2013-11-19 02:50:17

标签: javascript d3.js

我的数据在数组的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] )
   }
}

1 个答案:

答案 0 :(得分:2)

Javascript中没有任何内容 - 您所谈论的是一个对象。您要查找的语法是BTNDATA.B0.push(1)BTNDATA['B0'].push(1)。使用您当前的代码,变量B0将被取消引用以转换为BTNDATA,从而为您提供不良结果。