dc.js - 是否可以在页面加载时显示用户抓取句柄

Question

我正在构建一个供内部使用的基本仪表板。我对D3 / SVG等经验不多，所以如果这很明显，请原谅我：

目标

我有一系列时间值，一年中每个日期有一个值。受到dc.js wesbite上的示例的启发，我正在显示整个系列的“迷你”条形图，并允许用户选择一个范围，该范围又设置了“大”的轴刻度范围的限制'线图。

默认情况下（在页面加载/ refreshAll（）上）我将大线图的限制设置为最近的60天。

鼓励用户使用底部的迷你图设置他们想要的范围，当他们这样做时，会出现“抓握手柄”，并在迷你图上突出显示所选范围，例如：

我的问题

在页面加载/ refreshAll（）上，抓取手柄和范围突出显示不会显示在迷你图上，例如：

问题

有没有办法可以设置抓取手柄在页面加载时出现？

Answer 1

以下是我使用crossfilter和dc.js的方法。你可以通过以下方式获得最后x天：

xrange = d3.extent(data, function(d) { return d.date; });
last60 = [d3.time.day.offset(xrange[1], -60), d3.time.day.offset(xrange[1], 1)]

假设您的数据中有date。在用d3读取数据之后但在将其送入交叉滤波器之前执行此操作。

然后对于底部图表（迷你图），只需将filter属性设置为：

.filter(last60)

并将顶部图表的xrange设置为相同的范围：

.x(d3.time.scale().domain(last60))

像这样的东西也可能用于设置xrange，但我没有取得任何成功：

topchart.focus(bottomchart.filter())