将新数据传递到D3热图

时间:2019-05-21 04:29:21

标签: javascript d3.js

我正在创建交互式可视化,根据用户的输入过滤源数据。我试图将更新的数据传递给d3,但是它不起作用。

创建热图的核心代码:

var cals = d3.select("body").append("svg").selectAll("g")
    .data(yearlyData)
    .enter()
    .append("g")
    .attr("id","svgGroup")
    .attr("transform",function(d,i){
        return "translate(0,"+(yOffset+(i*(height+calY)))+")";  
    })

var dataRects = cals.append("g")
    .attr("id","dataDays")
    .selectAll(".dataday")
    .data(function(d){
    return d.values;   
    })
    .enter()
    .append("rect")
    .attr("fill", function(d) {
....
    })

我有一个回调函数来更新热图:

function update(newData){

dataRectsGlo.data(newData).transition()
    .duration(500)
    .attr("height",33)
            .attr("fill", function(d) {
        if (d.DEPARTURE_DELAY<breaks[0]) {
            return colours[1];
        }
        for (i=0;i<breaks.length+1;i++){
            if (d.DEPARTURE_DELAY>=breaks[i]&&d.DEPARTURE_DELAY<breaks[i+1]){
                return colours[i+1];
            }
        }
        if (d.DEPARTURE_DELAY>breaks.length-1){
            return colours[breaks.length]   
        }
    })

}

该代码无效。我认为问题出在如何将Newdata传递给D3。我是D3的新手。我可以帮忙吗?

谢谢!

0 个答案:

没有答案