多維數組切片多個html表和導航d3.js

Question

我的意圖是將較長的file.csv數據放入幾個html表中，每個表具有500行。 示例：.csv中的5000行創建10個表，每個表具有不同的內容（即行0-500、500-1000，...）； 還：到達表的10個鏈接。

任務：切片數組以獲取每個單獨表的數據。

到目前為止，基本的“偽”代碼：

//創建鏈接

var rowli = boxlist.selectAll("li")
                .data(groups)
                .enter()
                .append("li")
                .append("div")
                .text(function(d) {return d.length;})
                .on("click",Slide);
                .on("mousedown",tabulate(startslice=0,stopslice=500);

//function that draws table:

function tabulate(data, groups,startslice, stopslice) {

var boxlist = d3.select("#ul_id")
                .append("ul")

// create links with popout transition, target is view-select.


//create table

var table = d3.select("#container").append("table"),
    tbody = table.append("tbody");

// create a row for each object in the data

var rows = tbody.selectAll("tr")
    .data(data.slice(startslice,stopslice)
    .enter()
    .append("tr")

// each row appends td

  rows.append("td")
    .html(function(d) { return d[0];});
return table;
};

// render the table

var peopleTable = d3.text("data.csv", function(data) {

var arrofarrays = d3.csv.parseRows(data);

var groupsize = 500;
var groups = arrofarrays.map(function(item, index){
  return index % groupsize === 0 ? arrofarrays.slice(index, index+groupsize) : null;})
.filter(function(item) {return item;});

var peopleTable = tabulate(arrofarrays, groups);

}); 

我想將事件處理程序附加到每個鏈接：

function sliceArray (startslice,stopslice) {
 arrofarrays.slice(startslice,stopslice);
};

我無法弄清楚如何以編程方式分配變量“ startslice，stopslice”，以便每個鏈接都有自己的值。

我的目的是在d3.js中執行此操作。

Answer 1

我終於選擇了以下解決方案：

var rowli = boxlist.selectAll("li")
                .data(groups)
                .enter()
                .append("li")
                .append("div")
                .attr("class","innerLi")
                .attr("data-vin","view-select")
                .attr("data-sd","popout")
                .attr("id",function(d, i){var result='a'+i; return result; })
                .text(function(d) {return d.length;})
                .on("click",Slide);

     boxlist.selectAll("div").on("mousedown",function(d,i) { 
        tabulate (arrofArro, groups, start=+i*groupsize, stop=(+i+1)*groupsize); 
    });

在這里，我使用“ + i”來獲取一個變量，該變量在每次調用數據集時都會增加。 我的數據集不包含我可以使用的任何數據。

“開始”和“停止”傳遞到繪制html表的“制表”函數內部的data.slice（start，stop）。

這給了我想要的效果：每個鏈接調用數據集的不同部分。