意外的画笔过滤行为答案

【问题标题】：Unexpected brush filtering behaviour意外的画笔过滤行为
【发布时间】：2014-08-01 15:19:31
【问题描述】：

我最近开始学习 D3.js、Crossfilter 和 Dc.js，并且正在与一个我无法深入解决的问题正面交锋。

我有两个折线图，一个代表所有数据的概览，另一个代表通过刷亮概览创建的更细化、放大的区间版本。两个折线图都以相同的间隔呈现（见下文）。

顶部图表设置为以下选项：

.dimension(CRS.dimensions.hourly)
.group(CRS.groups.hourly)

和底部：

.dimension(CRS.dimensions.daily)
.group(CRS.groups.daily)

相关的初始化是

dimensions.hourly = crs.dimension(function(d){ return d.dd })
dimensions.daily = crs.dimension(function(d){ return d3.time.day(d.dd) })

groups.hourly: dimensions.hourly.group().reduce(
        function(p,v) {
            p.imps += v.imps
            p.clicks += v.clicks
            p.conversions += v.conversions
            p.cost += v.cost

            return p
        },
        function(p,v) {
            p.imps -= v.imps
            p.clicks -= v.clicks
            p.conversions -= v.conversions
            p.cost -= v.cost

            return p
        },
        function() {
            return {
                imps:0,
                clicks:0,
                conversions:0,
                cost:0
            }
        }
    ),
    groups.daily: dimensions.daily.group().order(function(d){return d}).reduce(
        function(p,v) {
            p.imps += v.imps
            p.clicks += v.clicks
            p.conversions += v.conversions
            p.cost += v.cost

            return p
        },
        function(p,v) {
            p.imps -= v.imps
            p.clicks -= v.clicks
            p.conversions -= v.conversions
            p.cost -= v.cost

            return p
        },
        function() {
            return {
                imps:0,
                clicks:0,
                conversions:0,
                cost:0
            }
        }
    )

理想情况下，底部图表在刷过时不会改变，但事实并非如此。当我刷底部图时，它会自动更新以将所选间隔之外的所有值设置为 0，这是不希望的：

在区间外单击会重置顶部图表（应该如此），但底部图表不会改变：

我尝试了几种解决方案来使底部图不可变，包括将groups.daily 更改为reduceSum，但均无济于事。我认为问题在于我如何处理尺寸，但到目前为止我一直无法获得所需的结果。

如果有人能指出我正确的方向，那就太棒了！谢谢！

【问题讨论】：

看起来您已将画笔选择连接起来，通过过滤下图的域内容来过滤上图中的数据，但随后您将下图的数据设置为过滤数组。
@BenLesh，我明白了。考虑到顶部和底部图形的尺寸都连接到相同的初始对象属性（d.dd），这是有道理的。如何设置下图，使其数据不会改变，或者在刷机时不会被过滤？
对不起，我希望能提供更多帮助，但我并不是 Crossfilter 方面的专家。如果是处理一些画笔事件，然后手动更新上图中的数据，我会说确保您使用的代码 only 在上图中将 .data() 设置为一些新的 filter()'ed 或 splice()'ed 数组。我希望这会有所帮助。
crossfilter 的预期行为是每个维度都会过滤其他维度，但（当然）不会过滤自身。假设您希望每个图表过滤另一个图表，看起来您的定义正确，但您的维度和组可能在图表中不匹配？请再看一下图表的.group() 和.dimension() 初始化。

标签： javascript d3.js dc.js crossfilter

【解决方案1】：

我最终求助于.on("preRedraw") 监听器，如下所示：

.on("preRedraw", function(){
    CRS.dimension.hourly.filterAll();
})

我不确定这是否是最好的解决方案，但它似乎可以解决问题！

【讨论】：