为什么我的圈子和文字不能同时退出和删除

时间:2013-06-03 22:30:58

标签: javascript html d3.js

我使用setInterval来更新我的数据:setInterval(function() { update(nextDay(data)) }, 10);所有圈子,行和文字同时输入,但无法同时退出。 在这里我输入了两次文本,因为我需要显示两种不同类型的文本,我可以在同一个svg中调用两次enter()文本吗? 这是我的更新功能:

function update(data){

    var bcircle = group.selectAll('circle').data(data)
    bcircle.enter().append('circle')
        .attr('cx', function(d) {coords = projection([d.long,d.lat]); return  coords[0]})
        .attr('cy', function(d) {coords = projection([d.long,d.lat]); return  coords[1]})
        .attr('r',  function(d) { return countScale(d.count)})
        .attr("stroke", function(d, i) { return color(d.name, i);}) 
        .attr("stroke-width", 2.3)
        .style('fill', function(d) { 
                if (d.count == 0){ return 'white';}
                if (d.count !== 0){ return color(d.name);}
            });
    bcircle.exit().remove();

    var btime = group.selectAll('line').data(data)
    btime.enter().append("line")
        .attr('x1', function(d) {return timeScale(d.time)})
        .attr("x2", function(d) {return timeScale(d.time)})
        .attr("y1", lineHeight+5)               
        .attr("y2", lineHeight-5)
        .attr("stroke", "black")
        .attr("stroke-width", "5"); 
    btime.exit().remove();  

    var timelb = group.selectAll("text").data(data)
    timelb.enter().append("text")
            .attr('x', function(d) {return timeScale(d.time)})
        .attr('y', lineHeight+20)
        .attr("dy", ".25em")
        .style("text-anchor", "middle")
        .text(function(d) {return time2label(d.time)})
        // .attr("font-family", 'sans-serif')
        // .attr("font-size", 19 + "px")
        // .attr("fill", 'black');      
    timelb.exit().remove();

    timelb.enter().append("text")
        .attr('x', function(d) {coords = projection([d.long,d.lat]); return  coords[0]+20})
        .attr('y', function(d) {coords = projection([d.long,d.lat]); return  coords[1]-5})
        .attr("dy", ".25em")
        .style("text-anchor", "end")
        .text(function(d) { return d.name + ":" + d.count; })
        .attr("font-family", 'sans-serif')
        .attr("font-size", 19 + "px")
        .attr("fill", 'black'); 
    timelb.exit().remove();
}

0 个答案:

没有答案