添加在dc.js過濾器/ Crossfilter不更新圖表

Question

的jsfiddle： http://jsfiddle.net/PYeFP/

我有一個條形圖設置一個由一天

 tripVolume = dc.barChart("#trip-volume") 
       .width(980) // (optional) define chart width, :default = 200 
       .height(75) // (optional) define chart height, :default = 200 
       .transitionDuration(0) // (optional) define chart transition duration, :default = 500 
       .margins({ top: 10, right: 50, bottom: 30, left: 40 }) 
       .dimension(tripsByDateDimension) // set dimension 
       .group(tripsByDateGroup) // set group 
       // (optional) whether chart should rescale y axis to fit data, :default = false 
       .elasticY(false) 
       // (optional) whether chart should rescale x axis to fit data, :default = false 
       .elasticX(false) 
       // define x scale 
       .x(d3.time.scale().domain([tripsByDateDimension.bottom(1)[0].startDate, tripsByDateDimension.top(1)[0].startDate ])) 
       // (optional) set filter brush rounding 
       .round(d3.time.day.round) 
       // define x axis units 
       .xUnits(d3.time.days) 
       // (optional) whether bar should be center to its x value, :default=false 
       .centerBar(true) 
       // (optional) render horizontal grid lines, :default=false 
       .renderHorizontalGridLines(true) 
       // (optional) render vertical grid lines, :default=false 
       .renderVerticalGridLines(true) 
       .brushOn(false); 

該圖顯示的曲線圖旅行的用戶數很好，但我想用一些jQuery控件來過濾它。 當用戶選擇日期我試圖添加一個過濾器到圖表時，過濾器被添加，但圖表不會更改，即使我redraw()或render()。

這是crossfilter如何設置：

tripsCx = crossfilter(data.rows); 
var allTripsGroup = tripsCx.groupAll(); 

var tripsByDateDimension = tripsCx.dimension(function (d) { return d.startDate; }); 
var tripsByDateGroup = tripsByDateDimension.group(d3.time.day); 

下面是一些我已經習慣了嘗試應用過濾器的方法：

這應該使用filterRange：

d.filter(d.dimension().top(20)[19], d.dimension().top(20)[0]); 

FilterFunction：

d.filter(function (d) { 
    return d.getTime() > start.valueOf() && d.getTime() < end.valueOf(); 
}); 

FilterExact：

d.filter(d.dimension().top(20)[0]); 

我還試圖繞過圖表和直接在尺寸應用濾波器：

d.dimension().filterFunction(function (d) { 
    return d.getTime() > start.valueOf() && d.getTime() < end.valueOf() 
}); 

沒有我已經做使圖表來改變。

我開始認爲我對濾波器函數應該做什麼有錯誤的期望？

如何手動過濾維度中的數據以更新圖表？ 我不想使用畫筆。 我將根據不同的標準過濾數據，我只是試圖讓簡單的案例工作。

我已經花了幾天的時間了，現在我不知道下一步該做什麼。

任何幫助將不勝感激。

Answer 1

你有沒有嘗試設置crossfilter過濾

我有幾分相似的情況下，我每次更改過濾值動作後做的是沿着

東西線後，圖的你的X屬性重置

.x（..）。dimension（...）。group（...）

創建後/設置試圖做類似的評論每討論的是

$('#filter').on('click', function(){ 
    var minDate = tripsByDateDimension.top(5)[4].startDate; 
    var maxDate = tripsByDateDimension.top(5)[0].startDate; 
    console.log(tripVolume.filters()); 


    tripVolume.filter([minDate, maxDate]); 
    tripVolume.x(d3.time.scale().domain([minDate,maxDate])); 

    console.log(tripVolume.filters()); 

    dc.redrawAll() 
}); 

http://jsfiddle.net/PYeFP/5/

更好的答案過濾器

是將過濾器添加到維度，不是圖表

最後，需要了解https://github.com/square/crossfilter/wiki/API-Reference#group-map-reduce

注意：除相關尺寸的過濾器外，分組與交叉過濾器的當前過濾器相交。因此，組方法只考慮滿足除了這個維度過濾器之外的每個過濾器的記錄。因此，如果支付的交叉過濾按類型和總計進行過濾，則按總計分組只按類型觀察過濾器。

（見https://groups.google.com/d/msg/dc-js-user-group/UFxvUND7hmY/btbAjqIIzl8J）