如何在箱形图dc.js中仅显示有限数量的记录

Posted 2021-04-13

我想显示最新的10个箱形图。

如果将过滤器应用于条形图或折线图，则箱形图应根据这些过滤器显示最近的10条记录。

我按日期（常规）标注尺寸。但是我无法得到结果。

我不知道如何与假小组一起做。我是dc.js的新手。

场景的图片附后。让我知道是否有人需要更多细节来帮助我。

在图像中，我按时标尝试了一些解决方案。

答案

您可以使用两个伪造的组来执行此操作，一个伪造组可以删除空箱图，而另一个可以取结果数据的最后N个元素。

删除空箱图：

  function remove_empty_array_bins(group) {
    return {
      all: function() {
        return group.all().filter(d => d.value.length);
      }
    };
  }

这只是过滤垃圾箱，删除.value数组长度为0的任何地方。

取最后N个元素：

  function cap_group(group, N) {
    return {
      all: function() {
        var all = group.all(),
            len = all.length;
        return all.slice(len - N, len);
      }
    };
  }

这基本上是cap mixin的工作，除了没有为“ others”创建垃圾箱（这有点棘手）。

我们从原始组中获取数据，看数据有多长，然后从slice到len - N的那个数组N

将这些假货传递到图表时将其绑在一起：

  chart
    .group(cap_group(remove_empty_array_bins(closeGroup), 5))

我使用5而不是10，因为我要使用的数据集较小。

Demo fiddle。

此示例使用“实时”时间标度，而不是顺序日期。有几种日期排序方法，但是如果您的组仍按从低到高的顺序排序，这应该仍然有效。

如果没有，则必须编辑问题以包含用于生成序数日期组的代码示例。