2016-08-09 6 views
0

申し訳ありませんが、タイトルは少し曖昧です。 私は日付d ["d"]と時間d ["時間"]フィールドのイベントのデータセットを持っています。もともと時間は秒ですが、これはサーバー側を144の10分のビンに変更しました。Crossfilterはある次元を別の次元で選択した範囲で除算します

問題が発生しました。私は、日付ディメンションと時間ディメンションの2つのディメンションを作成しました。私は毎日のイベント数のbarchartを持っているし、1日の各10分のウィンドウでイベントの数のための別のbarchartを持っています。私のイベントが何ヶ月に渡って変化しているのか、そして「平均的な」日がどのようになっているかを見ることができます。

問題は時刻です。棒グラフは、選択した期間内のイベントの数を単純に合計します。私は実際に、選択した日付範囲の平均日(つまり、日付barchartで選択した日数で割ったもの)を時間グラフといいますか?

私は以下のreduce functionallityを使ってこれを試みましたが、それはうまく動作しません。

var ndx = crossfilter(sessiondata); 

    var dateDim = ndx.dimension(function(d) { return d["d"]; }); 
    var hourDim = ndx.dimension(function(d){return d["hour"];}); 
    // var uidDim = ndx.dimension(function(d) { return d["uid"];}); 

    var numEventsByDate = dateDim.group(); 

    var numEventsByHour = hourDim.group().reduce(
     function(p,d){ 
      p.timebin++ 
      if(d.d in p.days) p.days[d.d]++; 
      else { 
       p.days[d.d] = 1; 
       p.dayCount++;} 
      p.averagetime = p.timebin/p.dayCount 
      return p; 
     }, 
     function(p,d){ 
      p.timebin-- 
      p.days[d.d]--; 
      if(p.days[d.d] == 0){ 
       delete p.days[d.d]; 
       p.dayCount--;} 
      p.averagetime = p.timebin/p.dayCount 
      return p; 
     }, 
     function() { 
      return{dayCount:0, 
       days:{}, 
       timebin:0, 
       averagetime:0}; 
     }); 

    var all = ndx.groupAll(); 
var minDate = dateDim.bottom(1)[0]["d"]; 
var maxDate = dateDim.top(1)[0]["d"]; 

var timeChart = dc.barChart("#figure1"); 
var hourChart = dc.barChart("#figure3"); 

timeChart 
.width(750) 
.height(250) 
.margins({top: 10, right: 50, bottom: 30, left: 50}) 
.dimension(dateDim) 
.group(numProjectsByDate) 
.transitionDuration(500) 
.x(d3.time.scale().domain([minDate, maxDate])) 
.xUnits(d3.time.days) 
.elasticY(true) 
.xAxisLabel("Months") 
.yAxis().ticks(4); 

hourChart 
.width(730) 
.height(300) 
.margins({top: 10, right: 50, bottom: 30, left: 50}) 
.dimension(hourDim) 
.group(numProjectsByHour) 
.valueAccessor(function (d){return d.value.averagetime}) 
.transitionDuration(500) 
.centerBar(true) 
.gap(65) 
.x(d3.scale.linear().domain([0,24])) 
.xUnits(function(){return 10;}) 
.elasticY(true) 
.xAxisLabel("Hours of the Day") 
.yAxis().ticks(4);  

問題は、各timebinが日の異なる数、2 am-2:10amたとえばにおけるイベントの低い数を有する時間、すなわち周期で除算されることです。この期間は、ある日にゼロイベントが発生する可能性があるため、ゼロ日は平均に寄与しません。私が本当にやるべきことは、すべての時間ビンを同じ数字で分けることです。これは、日付グラフで選択された日数です。これを行う簡単な方法がありますか?

答えて

1

あなたのグループで平均を計算しないことをお勧めします。コンポーネントを追跡し、valueAccessorで平均を計算してください。このようにすると、timeChartから実際のフィルタを取得し、それを使ってグループ合計を分割することによって、値アクセサーで除数を適切に把握することもできます。あなたのhourChartの

だからあなたvalueAccessorはこのような何かを見終わるでしょう。この与えられた

.valueAccessor(function (d){ 
    var numberOfDays = 100 // Or whatever your unfiltered number of days is. 
    if(timeChart.filters().length === 1) { 
    // There is a filter in place 
    var firstDate = timeChart.filters()[0][0]; // Inclusive 
    var lastDate = timeChart.filters()[0][1]; // Not inclusive! 
    // Calculates the number of days between. Adjust +/-1 depending on your needs 
    var numberOfDays = d3.time.days(firstDate, lastDate).length 
    } 
    return d.value.timebin/numberOfDays; 
}) 

をあなただけnumEventsByHour、単純なカウントの寸法を作成し、これに基づいて、必要に応じvalueAccessorを調整することができます。

関連する問題