dc.js d3 + crossfilter.top将过滤后的数据导出到CSV

Question

我对代码示例进行了广泛研究，并且能够调用crossfilter的.top(Infinity)函数以在过滤后输出更新的数据记录。 我什至可以使用d3.csv.format .top(n)调用d3.csv.format以获得可下载的字符串化CSV输出。 但是我有几个问题。

1. 我在图表绘制方法中调用top和csv.format函数，如下所示：

    d3.csv("/data/acuityData.csv", function (data) { // format our data var dtgFormat = d3.time.format("%Y-%m"); var dtgFormat2 = d3.time.format("%a %e %b %H:%M"); data.forEach(function(d) { d.dtg1=d.dayOfWeek; d.dtg= dtgFormat.parse(d.year+"-"+d.month); d.dtg2=d.year; d.mag= d.acuityInitial; d.depth= d.waitTime; d.dispositions= d.disposition; }); // Run the data through crossfilter and load our 'facts' var facts = crossfilter(data); var all = facts.groupAll(); // for wait time var depthValue = facts.dimension(function (d) { return d.depth; }); var depthValueGroup = depthValue.group(); depthChart.width(930) .height(150) .margins({top: 10, right: 10, bottom: 20, left: 40}) .dimension(depthValue) .group(depthValueGroup) .transitionDuration(500) .centerBar(true) .gap(1) .x(d3.scale.linear().domain([0, 500])) .elasticY(false) .xAxis().tickFormat(function(v) { console.log(d3.csv.format(depthValue.top(500))); return v;}); dc.renderAll(); }); 

我删除了一些图表以节省空间。 我最重要的问题是关于调用此导出数据调用。 现在，我只不过是console.log输入输出，它在我的浏览器控制台中显示为一组“漂亮”的CSV数据。 我无法解决的问题是如何添加一个可以调用此方法的Export All链接，因为在d3.csv函数闭包范围之外无法访问此代码区域。 我将如何解决此问题？

2. 在CSV输出中返回的数据具有重复的行，因为它包括原始CSV文件中的列以及data.forEach(function(d){}块中可见的生成列的句柄。在CSV输出中显示如下：

acuityInitial,dayOfWeek,disposition,hour,month,waitTime,year,dtg1,dtg,dtg2,mag,depth,dispositions

不知道如何解决这个问题。 任何帮助表示赞赏。

Answer 1

我通过简单地使用jquery onclick处理程序解决了这个问题。 我想我只是需要解决这个问题。 还使用download.js触发使用javascript的文件下载

     depthChart.width(930)
        .height(150)
        .margins({top: 10, right: 10, bottom: 20, left: 40})
        .dimension(depthValue)
        .group(depthValueGroup)
        .transitionDuration(500)
        .centerBar(true)    
        .gap(1)  
        .x(d3.scale.linear().domain([0, 500]))
        .elasticY(false)
        .xAxis().tickFormat(function(v) {
         //function triggered onClick by element from DOM
             $("#exportData").unbind().click(function() {
                  download(d3.csv.format(depthValue.top(500))."exportedData.csv")
              });
        return v;});
    dc.renderAll();

    });