文章/答案/技术大牛

发布

社区首页 >问答首页 >如何使用crossfilter.js将数据添加到可重用的散图中？

问如何使用crossfilter.js将数据添加到可重用的散图中？
EN

Stack Overflow用户

提问于 2018-04-10 14:32:20

回答 1查看 66关注 0票数 0

我使用d3.js实现了一个可重用的图表(散点图)。我从csv文件output.csv获得x和y坐标。

如何初始化图表：

var chart = scatterPlot()
        .width(400)
        .height(400)
        .x(function (d) { return d.x; }) // x is the first coordinate, located in the csv file
        .y(function (d) { return d.y; }); // y is second coordinate



d3.csv("output.csv", function (data) {
        d3.select(".scatterplot")
            .datum(data)
            .call(chart)
    });

现在我想使用crossfilter库来提供链接和刷，但是我在实现上遇到了问题。我试过的是：

var csData = crossfilter(data);
csData.dimXY = csData.dimension(function(d){
    return d.x + d.y;
});

csData.byXY = csData.dimX.group();
d3.select(".scatterplot")
        .datum(csData.dimXY)
        .call(chart)

如何将交叉过滤器集成到这个问题中？

小提琴- JSFiddle

javascript

d3.js

crossfilter

回答 1

Stack Overflow用户

回答已采纳

发布于 2018-04-13 23:14:41

对我有用的是：

var chart = scatterPlot()
        .width(400)
        .height(400)
        .x(function (d) { return d.key[0]; }) // x is the first coordinate, located in the csv file
        .y(function (d) { return d.key[0]; }); // y is second coordinate

var csData = crossfilter(data);
csData.dimXY = csData.dimension(function(d){
        return [parseFloat(d.x1),parseFloat(d.y1)];
    });

csData.byXY = csData.dimXY.group();

d3.select("#scatterplot1")
            .datum(csData.byScatter.all())
            .call(chart);

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/49756311

复制

相似问题

问如何使用crossfilter.js将数据添加到可重用的散图中？
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何使用crossfilter.js将数据添加到可重用的散图中？EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何使用crossfilter.js将数据添加到可重用的散图中？
EN