D3.js 跟踪并过滤dc.js中的上月值

D3.js 跟踪并过滤dc.js中的上月值,d3.js,dc.js,crossfilter,stock,D3.js,Dc.js,Crossfilter,Stock,我有一个类似于中描述的问题 也就是说,我想在条形图中显示上个月的股票价值(按公司和产品类型),同时在折线图中显示股票随时间的变化 为了做到这一点,我需要通过绘制折线图来跟踪所选的上个月。在这里查看我的JSFIDLE: 我尝试的解决方案基于上述问题的唯一答案(顺便说一句,该答案未标记为已接受),并遵循以下逻辑: 1) 首先,我尝试识别交叉过滤数据集中的最后一个日期。初始化时,它将是在折线图中移动画笔之前我的时间维度的最后一个日期。否则,它将返回笔刷范围中第二个元素的日期。对于这个日期,我应用了上限

我有一个类似于中描述的问题

也就是说,我想在条形图中显示上个月的股票价值(按公司和产品类型),同时在折线图中显示股票随时间的变化

为了做到这一点,我需要通过绘制折线图来跟踪所选的上个月。在这里查看我的JSFIDLE:

我尝试的解决方案基于上述问题的唯一答案(顺便说一句,该答案未标记为已接受),并遵循以下逻辑:

1) 首先,我尝试识别交叉过滤数据集中的最后一个日期。初始化时,它将是在折线图中移动画笔之前我的时间维度的最后一个日期。否则,它将返回笔刷范围中第二个元素的日期。对于这个日期,我应用了上限函数,以确保它返回的日期作为我的时间维度中的确切日期存在

2) 我应用自定义reduce函数,排除与当前选择不同月份的数据

我的具体问题是:

  • 如何使变量(lastDate)成为被动变量?以下内容在控制台中运行良好:d3.time.month.ceil(getLastDate())。但是,它不会对交互式刷牙事件作出反应

  • 在我的自定义reduce函数中需要做哪些更改,以仅累积与lastDate相对应的值并排除所有其他值?由于某些原因,当前定义的customer reduce函数无法正确累积库存值。例如,在初始化时,如果我检查grpCompany所在的对象,它将股票的值显示为0。

    最后,在你把这个问题标记为重复之前,请考虑以下内容:

  • 原来的帖子似乎没有一个被接受的答案
  • 如果OP提供了一个工作的JSFIDLE,有人会提供帮助,但没有人提供
  • 我想在原始帖子中发表后续评论,要求澄清,但不可能这样做,因为我还没有发布评论所需的声誉

好的,这真的很复杂,这就是为什么我在开始评论前一个问题时说交叉过滤器不擅长这一点。我的回答很复杂,你还没有按照我的意思去做,但那不是你的错。该库支持您的一些建议,但总的来说,如果您的方法变得如此复杂,我建议您重新思考。但是,您所述的场景与上一个问题中的场景也有一点不同,并且有一个更简单的答案:

在您的情况下,您实际应该做的是使用自定义的dc.js filter函数,使库存余额表只过滤到刷子中的最后一个日期:

chartMonth
  ...
  .filterHandler(function(d,f) {
    if(f.length > 0) {
      d.filterExact(d3.time.month.ceil(f[0][1]));
      dateBal.innerHTML = d3.time.month.ceil(f[0][1]);
    } else {
      d.filterAll();
      dateBal.innerHTML = "No month selected"
    }
    return f;
  })
以下是基于您的JSFIDLE的工作版本:


这就是简单的答案。它实际上只是将整个交叉过滤器过滤到笔刷中选择的最后一个月(或者实际上是下一个月)。如果您还想根据笔刷选择的实际日期过滤其他一些图表,那么您正在讨论多个冲突的过滤器,而交叉过滤器目前不太支持这一点。我们对添加支持多个过滤器组的功能感兴趣,但尚未开始解决这一问题。在这种情况下,目前最好的方法可能是维护两个独立的交叉过滤器,并将不同的图表组从不同的交叉过滤器中删除。

好的,这真的很复杂,这就是为什么我在开始评论前一个问题时说交叉过滤器不擅长这一点。我的回答很复杂,你还没有按照我的意思去做,但那不是你的错。该库支持您的一些建议,但总的来说,如果您的方法变得如此复杂,我建议您重新思考。但是,您所述的场景与上一个问题中的场景也有一点不同,并且有一个更简单的答案:

在您的情况下,您实际应该做的是使用自定义的dc.js filter函数,使库存余额表只过滤到刷子中的最后一个日期:

chartMonth
  ...
  .filterHandler(function(d,f) {
    if(f.length > 0) {
      d.filterExact(d3.time.month.ceil(f[0][1]));
      dateBal.innerHTML = d3.time.month.ceil(f[0][1]);
    } else {
      d.filterAll();
      dateBal.innerHTML = "No month selected"
    }
    return f;
  })
以下是基于您的JSFIDLE的工作版本:


这就是简单的答案。它实际上只是将整个交叉过滤器过滤到笔刷中选择的最后一个月(或者实际上是下一个月)。如果您还想根据笔刷选择的实际日期过滤其他一些图表,那么您正在讨论多个冲突的过滤器,而交叉过滤器目前不太支持这一点。我们对添加支持多个过滤器组的功能感兴趣,但尚未开始解决这一问题。在这种情况下,目前最好的方法可能是维护两个单独的交叉过滤器,并将不同的图表组从不同的交叉过滤器中删除。

谢谢您的快速回答。提供的解决方案当然非常简单,并且工作得非常好。我只是在filterHandler中做了一点小小的更改,以包含一个f.length==0的条件,这样我就可以使用lastStaticDate应用过滤器。这允许条形图显示在已根据折线图中的最后日期过滤的页面加载上。感谢您的及时回答。提供的解决方案当然非常简单,并且工作得非常好。我只是在filterHandler中做了一点小小的更改,以包含一个f.length==0的条件,这样我就可以使用lastStaticDate应用过滤器。这允许条形图显示在已根据折线图中的最后日期过滤的页面加载上。