crossfilter:如何同时对开始日期和结束日期列使用交叉过滤器

crossfilter: how to use crossfilters for start date and end date columns simultaneously

我和这个question . Considering the same dataset, how can I perform this functionality through crossfilters. I am new to dc.js and crossfilter. I am trying to implement the bar and area plot as in this example有类似的情况。即使是这个例子也使用了 1 个日期列。我只能用开始日期来做。但是,我的要求是根据开始日期和结束日期过滤数据集。我找不到很多讨论同一问题的资源。

我们将不胜感激任何帮助和建议。

您可能认为这很简单,但实际上跟踪间隔是计算机科学的经典棘手问题之一,它需要一种称为 interval tree 的专门数据结构才能正确完成。

这是一个很常见的请求,所以出于好奇,我寻找了一个 JavaScript 区间树库和 found one by Mikola Lysenko

我已将其合并到 new example here. (source)

示例的重要部分首先是使用groupAll填充区间树:

      projectsPerMonthTree = ndx.groupAll().reduce(
          function(v, d) {
              v.insert(d.interval);
              return v;
          },
          function(v, d) {
              v.remove(d.interval);
              return v;
          },
          function() {
              return lysenkoIntervalTree(null);
          }
      )

接下来我们使用开始日期和结束日期填充一个假组,计算与每个月相交的所有间隔:

  function intervalTreeGroup(tree, firstDate, lastDate) {
      return {
          all: function() {
              var begin = d3.time.month(firstDate), end = d3.time.month(lastDate);
              var i = new Date(begin);
              var ret = [], count;
              do {
                  next = new Date(i);
                  next.setMonth(next.getMonth()+1);
                  count = 0;
                  tree.queryInterval(i.getTime(), next.getTime(), function() {
                      ++count;
                  });
                  ret.push({key: i, value: count});
                  i = next;
              }
              while(i.getTime() <= end.getTime());
              return ret;
          }
      };
  }

      projectsPerMonthGroup = intervalTreeGroup(projectsPerMonthTree.value(), firstDate, lastDate),

(如果我们使用对间隔树的较低级别访问,或者如果它有更丰富的 API 允许按顺序遍历间隔,这可能会更简单和更便宜。但这应该足够快.)

最后,我们设置 filterFunction 以便我们选择与给定日期范围相交的间隔:

  monthChart.filterHandler(function(dim, filters) {
      if(filters && filters.length) {
          if(filters.length !== 1)
              throw new Error('not expecting more than one range filter');
          var range = filters[0];
          dim.filterFunction(function(i) {
              return !(i[1] < range[0].getTime() || i[0] > range[1].getTime());
          })
      }
      else dim.filterAll();
      return filters;
  });

我已将其设置为过滤月份图表以显示与其自身日期范围相交的所有项目。如果不需要,可以将 groupAll 放在 intervalDimension 上。

解决方法真的很简单。创建两个维度:

  1. 按开始时间-startTimeDim
  2. 到结束时间 - endTimeDim

现在,要过滤掉与给定范围 - rangeStartrangeEnd 相交的区间,请应用以下内容:

  1. startTimeDim.filter([-Infinity, rangeEnd])
  2. endTimeDim.filter([rangeStart, Infinity])

这基本上过滤掉了在范围结束之前开始和在范围开始之前结束的间隔。