javascript - 从 dc.js 图表访问过滤/剪辑数据

标签 javascript d3.js dc.js crossfilter

我是 dc.js 的新手。

我有一些数据:

var data =
[
        {date: Date.UTC(2015, 4, 4), frame: "frame1" },
        {date: Date.UTC(2015, 2, 1), frame: "frame2" },
        {date: Date.UTC(2015, 2, 11), frame: "frame3" },
        {date: Date.UTC(2015, 1, 4), frame: "frame4" },
];

//create crossfilter
    cf = crossfilter(data);
//create dimension
    byDate = cf.dimension(function (d) {
            return d.date; 
    });
//create group
    byDateGroup = byDate.group();

我正在使用这个 dc.lineChart:

    //configure timeGraph
    timeGraph = dc.lineChart("#range")
    .width(document.body.clientWidth)
    .height(100)
    .dimension(byDate)
    .group(byDateGroup)
    .transitionDuration(500)
    .elasticY(true)
    .x(d3.time.scale().domain([(byDate.bottom(1))[0].date, (byDate.top(1))[0].date + 1000]))
    ;

我想访问由可调范围选择器栏过滤的数据。我认为将函数传递给 onfiltered 会起作用,但我不知道要从 chart 访问什么以返回当前过滤的数据。

    timeGraph.on("filtered", function (chart) {
     console.log(/* print the data filtered by the 'range selector' */);
});

Here's a JSFiddle with an example.如果该示例能够正常运行,那么表中显示的所有内容都应该显示在控制台中。

提前致谢。

最佳答案

在维度上使用top 方法。在您的 fiddle 上下文中,byDate.top(Infinity)

https://jsfiddle.net/6p3vhga9/

方法的 Crossfilter API 文档:https://github.com/square/crossfilter/wiki/API-Reference#dimension_top

关于javascript - 从 dc.js 图表访问过滤/剪辑数据,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30492721/

相关文章:

javascript - 如何从 Observable<Array<any>> 中删除特定元素

javascript - 将一系列 Node JS 缓冲区通过管道传输到 ffmpeg

javascript - 如何在每个矩形端点画圆

d3.js - d3 line 函数仅当我在 line 函数中包含一个虚拟参数时才有效。为什么?

javascript - 响应表在填充时会失去响应能力

javascript - 在Ajax中如何将html页面中的国家名称传递到php页面?

javascript - 如果从函数 (d) 设置,d3 鼠标悬停事件不会正确触发

javascript - 使用 DC.js(crossfilter 和 d3 便利库)时出现问题 - 条形图不显示值

javascript - 如何使用 aoColumns 添加或注入(inject)列到 jQuery 数据表?

d3.js - 在 ES6 中导入和使用 d3 及其子模块的正确方法是什么?