交叉过滤器：如何同时对开始日期和结束日期列使用交叉过滤器 [英] crossfilter: how to use crossfilters for start date and end date columns simultaneously

问题描述

我的情况与此问题相似。考虑相同的数据集，如何通过交叉过滤器执行此功能。我是dc.js和crossfilter的新手。我正在尝试实现示例中的条形图和面积图。即使这个例子也使用1 date列。我只能使用startdate来做。但是，我的要求是根据开始日期和结束日期过滤数据集。我找不到很多谈论同一问题的资源。

I have a similar situation as in this 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. Even this example is using 1 date column. I am able to do it with the startdate only. However, my requirement is to filter datasets based on startdate and enddate. I could not found many resources that talk about the same issue.

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

Any assistance and suggestions will be highly appreciated.

推荐答案

您可能希望这很简单，但是实际上跟踪间隔是计算机科学中最棘手的经典问题之一，它需要一种称为间隔树可以正确执行。

You might expect this to be simple, but actually keeping track of intervals is one of the classic tricky problems of computer science and it requires a specialized data structure called an interval tree to do it properly.

这很常见请求，因此出于好奇，我寻找了一个用于间隔树的JavaScript库，并由Mikola Lysenko找到了一个。

It's a pretty common request, so out of curiosity, I looked for a JavaScript library for interval trees and found one by Mikola Lysenko.

我已将其合并到此处的新示例。 （源）

I've incorporated it into a new example here. (source)

该示例的重要部分是首先使用 groupAll 填充间隔树：

The important parts of the example are, first, to use groupAll to populate the interval tree:

      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);
          }
      )

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

Next we populate a fake group using the start and end dates, counting all the intervals which intersect with each month:

  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，则这可能会更简单且更便宜。但这应该足够快。）

(This could probably be simpler and cheaper if we used lower-level access to the interval tree, or if it had a richer API that allowed walking the intervals in order. But this should be fast enough.)

最后，我们设置一个 filterFunction ，以便我们选择与给定日期范围相交的时间间隔：

Finally, we set a filterFunction so that we choose the intervals which intersect with a given date range:

  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 上。

I've set it up so that it filters the month chart to show all projects which intersect with its own date range. If this is not desired, the groupAll can be put on the intervalDimension instead.

这篇关于交叉过滤器：如何同时对开始日期和结束日期列使用交叉过滤器的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！