Javascript d3.直方图-从交叉过滤器中重新获取bin数据

d3的

柱状图

布局要求数据采用类似

[6,9,4,2,0,6,9]

的格式，并根据您的域、刻度等创建整齐的箱子

交叉过滤器将数据分组为直方图结构（或多或少），其结构如下：

[
  { key: 0, value: 1 },
  { key: 1, value: 8 },
  { key: 3, value: 7 },
]

请注意，键2没有对象。存储箱的数量只是数据中不同值的数量。同时，

d3.histogram（）.threshholds（…）

将允许我控制我得到多少个箱子

---

我想可视化交叉过滤数据，并利用

d3.histogram（）

的功能来制作方便的垃圾箱。是否有一些访问器函数可用于解析交叉筛选数据？或者我需要先强制它进入一个正则数组吗

我仍在探索这一点，但这里有一个

reduce

函数，可以将交叉过滤器组数据展平/扩展为d3的

直方图布局的数组：

// reduce callback function
function flattenGroupData(flattened, currentRecord) {
  let value = currentRecord.key;
  let quantity = currentRecord.value;
  let expandedArray = Array(quantity).fill(value);
  return flattened.concat(expandedArray);
}

let groupData = myCrossfilterGroup.all();

let dataForD3 = groupData.reduce(flattenGroupData, []);

这是我不理解的：
d3。直方图
是用来获取原始数据并将其放入垃圾箱的。Crossfilter执行相同的操作，并且您显示的组输出已经“装箱”或聚合。我会说要么使用交叉过滤器，要么使用d3.histogram，但我看不出两者都使用的理由。如果问题更多地围绕着如何在d3可视化中使用交叉过滤器输出，我们可以解决这个问题，但也有一些教程，比如关键的区别是使用
d3.histogram
，使用
d3.histogram.thresholds（）
之类的东西，可以灵活地使用d3.histogram.thresholds（）。例如，如果输入数据有一百万个不同的值，但我只需要15个箱子。对不起，我应该更清楚我问的原因。我将更新问题以澄清问题。Crossfilter的dimension.group具有一个访问器函数，允许您控制如何将维度键放入组中。这就是你要找的吗？我不这么认为，或者不完全是。。。我想我仍然需要调整数据，以确保数组具有连续的值，并且我需要知道最小/最大范围，以确定如何将其放入X个容器中，不是吗？对于d3，我可以只说
阈值（x.ticks（15））
大约15个ticks。如果我要对输入数据进行大量的操作，那么我最好将其强制到d3的结构中。或者我可以用交叉过滤器来做这些吗？我可能误解了文档。你可以使用Crossfilter和一个包装组来完成这一切，如果需要的话，它可以添加垃圾箱，但是你最好只使用d3.histogram和ditching Crossfilter，除非你有迫切的需要使用Crossfilter。