Javascript 意外的笔刷过滤行为

Javascript 意外的笔刷过滤行为,javascript,d3.js,dc.js,crossfilter,Javascript,D3.js,Dc.js,Crossfilter,我最近开始学习D3.js、Crossfilter和Dc.js,并与一个我无法深入解决的问题针锋相对 我有两个折线图,一个表示所有数据的概览,另一个表示更精细、放大的interval版本,该版本是通过浏览概览创建的。两个折线图的渲染时间间隔相同(见下文) 顶部图形设置为以下选项: .dimension(CRS.dimensions.hourly) .group(CRS.groups.hourly) 下面是: .dimension(CRS.dimensions.daily) .group(CRS

我最近开始学习D3.js、Crossfilter和Dc.js,并与一个我无法深入解决的问题针锋相对

我有两个折线图,一个表示所有数据的概览,另一个表示更精细、放大的interval版本,该版本是通过浏览概览创建的。两个折线图的渲染时间间隔相同(见下文)

顶部图形设置为以下选项:

.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,这是不希望的:

在间隔外单击可重置顶部图形(应如此),但底部图形不会更改:

我尝试了几种解决方案,使底部的图形不可变,包括将
组.daily
更改为
reduceSum
,但没有效果。我认为问题在于我如何处理维度,但到目前为止我还无法得到期望的结果


如果有人能给我指出正确的方向,那就太棒了!谢谢

我最后求助于
.on(“preRedraw”)
监听器,如下所示:

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

我不确定这是否是最好的解决方案,但它似乎做到了

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