Animation 使用setInterval在d3中重复转换

在下面的代码中，我只有5个条对应于它们在dataset中的值。对于.each和setInterval，如果数据集中的相应值小于3，我将尝试让条形图填充颜色从黑色反复转换为红色

<script type="text/javascript">

var w=500;
var h = 100;
dataset = [1,2,3,4,5];

var svg = d3.select("body")
.append("svg")
        .attr("width",w)
        .attr("height",h);

    svg.selectAll("rect")
        .data(dataset)
        .enter()
        .append("rect")
        .attr("y", 0)
        .attr("x", function(d,i){ return i*21;})
        .attr("width",20)
        .attr("height",function(d){return d*10;})
        .each(function(d){
            if (d<3) {
                setInterval(function(){d3.select(this)
                    .attr("fill","black")
                    .transition()
                    .duration(1000)
                    .attr("fill","red")},1000);
            }
        });


    </script>

---

你有什么想法可以让它工作吗？我对任何解决方案都持开放态度，我只想得到它，这样，当它低于某个特定值时，一个棒就会脉冲。谢谢。

此

变量在新上下文中的值不相同。下面的代码应该可以工作

.each(function(d){
        var that = this;
        if (d<3) {
            setInterval(function(){d3.select(that)
                .attr("fill","black")
                .transition()
                .duration(1000)
                .attr("fill","red")},1000);
        }
});

。每个（函数（d）{
var=这个；
如果（d）
.each(function(d){
        var that = this;
        if (d<3) {
            setInterval(function(){d3.select(that)
                .attr("fill","black")
                .transition()
                .duration(1000)
                .attr("fill","red")},1000);
        }
});