使用新数据重绘DC JS图表

时间:2014-10-25 01:16:55

标签: dc.js crossfilter

我在crossfilter中有来自CSV的数据,如下所示:

罩,房间,时间戳,价格,占用

SF,2 - 溴,9/1 / 14,3950,0.94

我加载了数据,然后设置了我的过滤器:

var ndx = crossfilter(data);
var all = ndx.groupAll();

var price = ndx.dimension(function(d) {
    return d.price;
}); 

var occupancy = ndx.dimension(function(d) {
    return d.occupancy
}) 

var roomType = ndx.dimension(function (d) {
    var room = d.rooms_clean;
    return room; 
});  

var dateDimension = ndx.dimension(function (d) {
    return d.day;
    });                       

var hood = ndx.dimension(function (d) {   //dimensions for choropleth
    return d.hood;
});

dataUnit = "price"
var roomAll = roomType.group().reduce(reduceAddAvg(dataUnit), reduceRemoveAvg(dataUnit), reduceInitAvg) // create vector with stats by room type 
var hoodAll = hood.group().reduce(reduceAddAvg(dataUnit), reduceRemoveAvg(dataUnit), reduceInitAvg) // create vector with stats by hood
var dateAll = dateDimension.group().reduce(reduceAddAvg(dataUnit), reduceRemoveAvg(dataUnit), reduceInitAvg) // create vector with stats by date
var roomGroup = roomType.group();     

我的所有图表都基于dataUnit =“price”。我可以重新加载页面设置dataUnit =“occupancy”,并且图表可以正确呈现。

我想允许用户单击按钮并在页面中呈现新的crossfilter。我尝试使用Jquery创建一个按钮来处理所有维度并创建新维度:

   $('#occupancy').click(function() {

    roomType.dispose()
    hood.dispose()
    dateDimension.dispose()

    dataUnit = "occupancy"
    var roomAll = roomType.group().reduce(reduceAddAvg(dataUnit), reduceRemoveAvg(dataUnit), reduceInitAvg) // create vector with stats by room type 
    var hoodAll = hood.group().reduce(reduceAddAvg(dataUnit), reduceRemoveAvg(dataUnit), reduceInitAvg) // create vector with stats by hood
    var dateAll = dateDimension.group().reduce(reduceAddAvg(dataUnit), reduceRemoveAvg(dataUnit), reduceInitAvg) // create vector with stats by date
    var roomGroup = roomType.group();     

    dc.redrawAll();             
    return false;
})

但这只会导致地图不更新。如何在不重新加载页面的情况下切换所有交叉过滤器使用的维度/数据?

1 个答案:

答案 0 :(得分:0)

看起来您想要做的是保留尺寸,但每次选择新计算时都要替换这些组。

您引用的代码正在处理但未重新创建尺寸;它正在创建新组但不处理旧组。它看起来不像你想要重新创建维度,所以那些处理调用可能不是一个好主意。

您需要将新组分配给图表。只是创建crossfilter对象不会让dc.js知道它们(并且使用相同的变量或变量名称并不意味着它会接收它们。)

对每个图表及其重新创建的组执行chart.group(...),您应该会看到更新。您可能应该处理旧组而不是尺寸。